Set up the Welo Badge with the Code
The integration of the Welo badge through an embed code is a practical and intuitive method that allows you to add the badge to your website in a few simple steps.
Thanks to this solution, you can customize its appearance and positioning according to your needs, modifying a few lines of code to adapt it perfectly to the design of your page. If you have difficulties during integration, our support team is always available to help you.
We'll provide you with detailed guidance and step-by-step support to ensure the process runs smoothly. Below are the steps necessary to successfully integrate the Welo badge on your site:
Find the 'Embed' Function
Most website builders offer a feature called 'Embed', 'Code' or 'Custom HTML'. This option allows you to insert custom code directly into the pages of your site. Follow these steps:
Log in to your website builder and look for a section or block where you can insert custom HTML code. This option is usually found in the settings menu or among the site's customization tools.
If you can't find it, consult your builder documentation for instructions on how to add custom code to your page.
Welo Badge Code
Before pasting the code into the 'Embed' or 'Code' function, proceed with the following steps:
1) Choose the badge that best suits your company through the Widgets page.
2) Customize the code as you prefer by following the following steps:
In the code you will find some values to replace,
They should always be placed in quotes (” “) and the quotes must not be removed.
INSERT_HERE_YOUR_WELO_PAGE
This is the full URL of your Welo Page.
Example:
https://www.welobadge.com/welo-page/welo
INSERT_HERE_THE_COMPANY_NAME
This is the name of your company that will be shown in the widget texts.
Example: Welo
YOUR-COMPANY_SLUG
It is the unique identifier of your company assigned by Welo.
It corresponds to the final part of the URL of your Welo Page (after the last “/”).
It must be All lowercase And it is Case Sensitive.
Correct example: welo
Invalid example: Welo
You can always find the correct slug in your Welo dashboard or directly in the URL of your Welo Page.
The default value of the image width is set to
However, for those who are a little familiar with the code, it is possible to adjust the size of some badges and customize their appearance.
The default value of the image width is set to 200px. If you want the badge to be larger or smaller, change the value of Max-width in the code. For example, to enlarge it to 300px, just type max-width: 300px;.
⚠️ Please note: You cannot use a badge larger than 400px.
Once done, you're ready to paste the code and go!
Save and Publish Your Site
Once you've customized the code, save your changes and publish your site. The Welo badge should appear on your page, confirming your company as certified. If you have chosen to use a hover effect, the badge will change brightness when the user hovers over it, giving a dynamic effect to the site.
If you need help or support you can contact our team.
If you use a Website Builder like WordPress, Shopify, Wix, or similar, this special page will help you quickly find the right sections to integrate the Welo badge.