Deutsch
English
Español
Português
ItalianoHow to add, remove or rearrange elements of my White Label account?
As administrator of a White Label account, you can fine-tune the look and feel of your instance from their Branding section by simply setting up some options and adding CSS code.
Advanced tutorial - We only offer first level support on how to use the platform and its functionalities. Custom design, custom coding and third party integrations are not included in any of our plans.
Code injection in your White Label account
If you want to go one step further and add your own contents and functionalities to your instance you can embed you own JS or jQuery scripts on the Inject Custom Code > Footer of your Branding section.
Script examples
The following examples can be added and adjusted to match your needs:
Add an option to your users sidebar menu
The following code will add a link to the sidebar of the users of your White Label account
$(document).ready(function(){
$("body[id^='uuser-'] div.menu ul.sub-menu").append(
"<li class='li-menu-extra'>
<a class='gray' href='https://google.com'>
<span class='qr-api-user'>My link</span>
</a>
</li>");
});Add a link to your users top bar
The following code will add a link to the top bar of the users of your White Label account.
$(document).ready(function(){
$("body[id^='uuser-'] a.account").after(
"<a href='https://google.com'>My link</a>");
});Add a link to footer
The following code will add a link at the beginning of the footer of the users of your White Label account.
$(document).ready(function(){
$("body[id^='uuser-'] #footer p.privacy").prepend(
"<a href='https://google.com'>My link</a>");
});The following code will add a link at the end of the footer of the users of your White Label account.
$(document).ready(function(){
$("body[id^='uuser-'] #footer p.privacy").append(
"<a href='https://google.com'>My link</a>");
});Replace logo of extra user
You can use your customer's logo on an extra account of a White Label plan. You only need to upload the image file to the Media section of your account and add the following code to the Branding > Inject custom code > Header section.
<style>
.user-[username] .branding-logo a img {
content: url(https://qrtracker.splashprinting.co.uk/l/media?f=ce679cb3feec6acbddb537bdab16a679&fullsize=1
);
}
</style>Resize the content section of a business card
You may want to use a business card only to display a set of call-2-action buttons. In this case, if you are not adding any content, that area will appear empty and it will take too much space.
You can adjust the minimum height of the content block by adding the following CSS rule on your Business Card > Branding section or use it in a CSS template.
#content {
/* Eliminates the minimum height of the content section*/
min-height: unset;
}IDEA: The "About me" field of the business card can be used to add some context to the landing page.
Move the call-2-action buttons to the top of your business card
You can add the following code on the Branding > Custom Landing Page Footer to change the order of the elements of your business card. Only available on White Label plans.
<script>
$(".businesscard-container #footer").insertBefore(".businesscard-container #main");
</script>
<style>
#footer {margin:unset;
padding:5px 0;}
</style>