Can I Change Glyphicons to Custom Graphics?

Unite Theme
1

Hi,

I’m currently making my site locally using the Unite theme (great template!) and would like to change the glyphicon that separates blog posts with my own icon.

Can this be done?

Also, is there way to alter the colour of glyphicons? Is there a comprehensive list somewhere of what glyphicons are available, along with their names?

Thank you,
NH

2

You can replace divider icon by simply adding this code to Appearance >> Theme Options >> Other >> Custom CSS.

hr.section-divider:after {
    content: "\f085";
}

There are over 400 different icons included with this theme and here you can see the entire library of these icons called Font Awesome.

Let me know if you have any other question.

3

Hi Aigars,

Thank you for your response! I applied the code to Custom CSS and it changed to cogs. I’d like to change the graphic to my own logo. Is there a way of using a graphic that I have uploaded?

Thanks,
NH

4

Also, is it possible to make the full-width page option the default option? I’ve used it for everything so far, but the sidebar still appears in the shop Page/Item Description page and Gallery when you select an image.

If there’s a way to override this, that would be great. Thanks! Really enjoying the template thus far. :slight_smile:

5

Then you will have to replace this line of code inside content-single.php and content.php files:

<hr class="section-divider">

With an actual image code of your own image. Here is an example using colorlib logo.

<div class="content-separator">
	<img class="seperator-img" src="https://colorlib.com/wp/wp-content/uploads/sites/2/colorlib-logo-top.png" alt="Colorlib logo"></img>
</div>

Once you are done with things mentioned above you will have to align logo properly and add a proper size for it. Here is CSS that you can use via the same Custom CSS field I mentioned in my previous answer.

.content-separator {
  text-align: center;
}
.content-separator img {
  width: 150px;
  height: auto;
}

This is just an example and you can base your solution on this.

6

Perfect, thank you! I aligned it by adding <center> and </center> at either ends of the image code.

Have you read my other message (above your response) regarding the Sidebar? I don’t mind it being present in the Blog Page, but not the Gallery (when you view images individually) and in the Shop.

7

Sorry forget to response to that.

For that I will need to see your website once it is online because there is no setting to disable sidebar on separate pages and you need to target those pages using CSS based on their IDs. There is no one size fits all solution.

Let me know when your website is live and I will try to help you from there.

8

Hi Aigars,

No problem, I’ll let you know when it’s up and running. Thanks for the prompt support solutions. :slight_smile:

Kind regards,
NH