How to Add Hello bar in Your Website?
Web toolbar or web bar is one of the simple and easy way to increase the user engagement in your site. Hello bar is one of such a free toolbar which you add in your site to drive traffic to a specific page or collect emails for subscription. This article explains step by step process of generating installation code and customizing Hello bar for your site for driving traffic.
Step1 – Starting with Site URL
Open Hello bar website, enter your site URL and click on “Create Your First Bar” button. Later you need to signup for an account in order to generate the installation code.
Step2 – Set Your Goal
Choose the purpose of installing Hello bar in your site. You have two options – drive traffic and collect email. Here we show with the example of setting goal as drive traffic. The preview of the bar will be automatically started showing in top of the screen.
Step3 – Creating the Bar
After choosing the goal the next step is building your bar. Enter the message to be shown in the bar and button in the corresponding text boxes. Click on the “Edit Link URL” to add a webpage which will be opened when someone clicks on the button.
Choose color of the bar to suit your site theme and click on the “Customize look and feed…” link.
Step4 – Customizing the Bar
You will lot of options to customize your bar and the changes will be reflected immediately in the preview bar to show you the look of the bar. Some important settings are:
- Size and Font – Choose the bar size and the font style to be shown on the bar.
- Positioning – Choose whether the bar should remain top of the page or scroll along with the content.
- Link – Choose whether the link should open in the same or new window.
Step5: Choose Platform for Installation
Once you complete the customization of your bar then choose the platform to generate the installation code. You have the following three options:
- Universal Code – Click on the first option if you want to install the code on any platforms other than WordPress. You need to have an access to edit source HTML code of your site in order to use this option.
- If you have a WordPress site then click on the “I use WordPress” option. Download the plugin and install it in your site.
- If your site is managed by someone else then choose the email option to generate the code and send an email to the site administrator instantly.
If you need any kind of assistance then click on “I need help” option.
Step6: Installing Code in Your Site
If you generated universal code then copy and paste the code in the header section of your site. This will display the bar in all your pages, you can also paste the code only in selected pages to display the bar on those pages. If your site has less number of pages then it is recommended to choose on what pages the bar is to be displayed and what pages are to be excluded during goal URL setting process.
In case of WordPress sites, just download the plugin and install it in your site.
Step7: Get a Success Message
Publish your site after installing the code and then click on the button “I’ve installed Hello Bar”. You will see a success message as shown in the below picture.
Step8 – Editing Your Bar
You can log in to hello bar site and edit your your bar anytime after successful installation. The bar displayed on your site will be automatically adjusted according to the changes and you need not to copy and paste the code every time. You can also pause or delete the bar and generate a separate bar for your mobile users.
Watch the video presentation on how to add hello bar on your site: