This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Change Circle Icon For Different Pages.

Open 4 replies themetheme-vantage
11 years ago · Last reply by Andrew Misplon 11 years ago

Hi
I got this CSS from a Thread in SiteOrigin Support

/* Circle Icon Text Color */

.widget_circleicon-widget .circle-icon-box p.text {
color: #a5a2a2 !important;
font-size: 16px;
}

/* Circle Icon More Link */

.widget_circleicon-widget .circle-icon-box a.more-button {
color: #dd3333 !important;
font-size: 20px;
}

.widget_circleicon-widget .circle-icon-box a.more-button:hover {
color: #fa920b !important;
}

It works well , but my question is : Is it possible to change the Circle Icon for each page separately, because i’m using different Background image for each page , so I need to change the color depending of the background Image color.
Hope you can help,
Thanks

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

4
  1. Andrew Misplon Staff 11 years, 6 months ago

    You can. View the page source on the page you want to do this with. See thehttps://siteorigin.com/basics/modifying-theme-design-with-custom-css/. The easiest way to inspect source code.

    For example for this page it would be:

    .postid-3348 .widget_circleicon-widget .circle-icon-box a.more-button:hover {
    color: #fa920b !important;
    }

  2. Mario Barretta 11 years, 5 months ago

    Interesting solution.
    But, for users not very skilled, how can they add a persoali icon icon that is not present on the default list?

    If is needed an other question i create it asap.

  3. Abo Surf 11 years, 5 months ago

    Hi Mario.
    You can upload your icon in PNG format to your media , then past it’s URL in ( Circle Background Image URL)
    Try http://www.flaticon.com/ for more icons , in this website it’s possible to download an icon in PSD file then customize it in photoshop as you want .( here is and example : http://www.abosurfmorocco.com/exploremore/ )
    Hope this information will help,
    Good luck,

  4. Andrew Misplon Staff 11 years, 5 months ago

    Thanks Abo, appreciate it.

    Mario you can also check out our new Widget Bundle plugin: http://wordpress.org/plugins/so-widgets-bundle/. In it you’ll find the Features Widget which has a much wider selection of icons. It’s basically an augmented Circle Icon Widget.

    For further assistance, please open a new support thread.

    Thanks

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread