Sidebar Widgets

Support
#1

Hello. I would like to setup my sidebar widgets to have boxes similar to this with a home icon etc. How would I achieve this?

https://www.screencast.com/t/biD4GTulqx

#2

Hi there,

You may add a Text Widget and use icons shortcode to insert the icon and add some html and the text and style it with some custom CSS for the formatting.

Hope this gets you started.

#3

Hi, Yes, I saw the icons shortcodes what type of html and custom css can I add?

#4

Hi there,

Please note that this is a customization that goes beyond our support as we cannot provide the actual custom codes for a feature that is not offered out of the box for X as there are instances that depending on the setup or changes made on your website, you will have to update the custom codes as well.

What you can try to do is add the icon shortcode first then the text after it and wrap then in a <p> tag.

You can then target the icon so that you can add some styling to it. You may add a class to the icon and use that to target the icon and trying adding a float: left declaration to the icon element.

For example, if you have added the a class called my-icon to the icon shortcode, the CSS should be something like:

.my-icon {
    float: left;
}

Hope this helps.

#5

How do I add he widgets just to my contact us page. I have added a sidebar to my contact us, however, when I go to the widgets page I am not sure where to add it so that it only shows in my contact us page.

#6

I simply just want to add a list of our different locations on the sidebar of our contact us page. What is the best way to add the different locations and have it look professional.

#7

Hi There,

Please add new text widget to the main sidebar.

Then add this code to the widget logic:

is_page('contact-us')

Hope it helps :slight_smile:

#8

Ok, so is this what I should do every time I want to add a widget to a particular page?

#9

Correct.

This is the fastest way!

#10

I simply just want to add a list of our different locations on the sidebar of our contact us page. What is the best way to add the different locations and have it look professional.

#11

Also, what if I want to add certain widgets to just certain pages. How can I do that??

#12

If figured out the last question so you don’t have to answer that.

I just want to know, I simply just want to add a list of our different locations on the sidebar of our contact us page. What is the best way to add the different locations and have it look professional.
Tks.

#13

Also, I noticed that the widgets are not falling in the order that I would like. I have tried to rearrange them but it is not working. I want to have the search and navigation menu show first and then the other widget with the locations. How can I make that happen?

#14

Hi,

  1. I checked and can see the locations in your sidebar.
    You are adding it the right way, it just needs some custom css to make it look the way you want.
    Unfortunately designing it is outside the scope of our support.

  2. You can drag your widgets into position.

See Video - https://www.screencast.com/t/frZBLQ4V

#15

Yes, I have dragged them, however, on certain pages , for example, I want to have the “search” button and the “navigation menu” appear first and then the locations.

#16

Hi there,

You can create multiple sidebars and assign specific sidebars to pages.

You can do this by creating first a sidebar in Appearance > Sidebars.

Once you have created a sidebar, you can go to Appearance > Widgets and you should be able to see the sidebar you have created as one of the widget locations. Add the widgets.

Go back to Appearance > Sidebars and assign which page you want the sidebar to show up.

Hope this helps.

#17

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.