Home>Support>Vantage Home Page – Start Editing… Example Button… Test Button…

Vantage Home Page – Start Editing… Example Button… Test Button…

Hi,
Your demo shows Text links for the above mentioned ‘buttons’. Can we make them into visual Buttons – how do we add button graphics?
Best,
Suzabelle

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Suzabella

    You can change this with some custom CSS. If you navigate to Appearance > Custom CSS, you’ll get our custom CSS editor. Just add the following code.

    .widget_circleicon-widget .circle-icon-box a.more-button {  font: bold 11px Arial;  text-decoration: none;  background-color: #EEEEEE;  color: #333333;  padding: 6px 6px 6px 6px;  border-top: 1px solid #CCCCCC;  border-right: 1px solid #333333;  border-bottom: 1px solid #333333;  border-left: 1px solid #CCCCCC;  width:100px;  margin: 0 auto;}

    This will give you a basic button but you could replace the element content with anything generated from here

    http://css3buttongenerator.com/

    Just make sure that the element tag is the same as above. The above site will not add a width or margin entry. These are only needed if you do not want the button to fill the width of the widget.

    Let us know how you get on

    Magus

  2. 9 years, 4 months ago suzabella

    Hi Magus,This was very helpful. Thank you.So is it possible to add a pop up window for the home page "More…" buttons?In the page builder there's a place for a URL address, but would I need to add an html page for the pop up via ftp in order for a small window to appear with some info?And if this is the case, do I need to create a child theme, in order to avoid losing customization work?Thank you,Suzabelle

  3. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Suzabella

    Unfortunately, this isn’t possible with the circle icon. I’ve marked this thread as a feature request. We often look through these threads to get ideas for what to add in our future updates. Hopefully, we’ll be able to add this function in a future update.

    As a workaround you could use a visual editor widget in conjunction with this plugin

    https://wordpress.org/plugins/wp-colorbox/

    You would remove all text and URL options from the circle icon widgets, leaving just the icon, and add a visual editor widget underneath each circle icon widget. You could then add your text and lightbox options in the visual editor window following the instructions on this page in the section for ‘Inline HTML in Lightbox’.

    http://noorsplugin.com/2014/01/11/wordpress-colorbox-plugin/

    The button styling could then be applied to the Lightbox link instead.

    Hope this helps get you started.

    Magus

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.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More