Services widget

Vlad - Within the services widget there is a button saying "SEE ALL OUR SERVICES"
I`d like to change the text and color of the button. Is that possible?

I am showing six services on the landing page (www.rh-c.eu) - they all have that background overlay. Is there a chance to make that six individual fields?

Thanks for your assistance.
Rob

You mean to remove the background for the services so they are separated? You can add this in a custom CSS plugin (also change #fff to the color you want for the button):


.service {
   background-color: transparent !important;
}
.services-area .all-news {
   color: #fff;
   border-color: #fff;
}

For the button text you would need to either translate it and change it to what you want, or change it manually. Go to Appearance>Editor, find fp-services.php and find this <?php echo __(‘See all our services’, ‘moesia’); ?>. Change only See all our services to the text you want. If you’re not comfortable with php files you can send an admin account for me at vlad[at]athemes.com and I can change it for you. I made a note to add this as an option in the next update.

Vald - Thanks for your prompt reply.
I`d like to keep the background and just make kind of a grid (3 + 3) -
a separate field (incl. the background) for each of the six
services.

Hi Vlad, I changed the background pic in services - now the two middle backgrounds for the services seem to have gone trapezoidal. Or is this an optical illusion?

www.rh-c.eu

Thanks!
Rob

They seem trapezoidal, yeah, especially the bottom one :slight_smile: But they’re not, it’s just an illusion.

Vlad - I changed the background pic to get rid off the illusion :slight_smile:

I`d like to match the all the buttons used to the “fragile” default
button design in the services area. Is there a chance to do this?

Thanks
Rob

www.rh-c.eu

All the buttons on the website?
Something like this should do it:


input[type="submit"] {
   background-color: transparent;
   box-shadow: none;
   border: 1px solid #000;
   color: #000;
   border-radius: 0;
}

Vlad - Thanks, the code works fine for the contact form. However,
the buttons on the single pages have not changed. Their code is

<span style=“color: #000000;”> [su_button style=“ghost” background="#000000" color="#000000" size=“6” center=“yes” radius=“5” text_shadow="0px 0px 0px "]Kontaktieren[/su_button]</span></p>

Those are shortcodes and have their own set of options. But you can add this to quickly change all of them:


.su-button-style-ghost span {
    border-width: 1px !important;
    text-transform: uppercase !important;
}

I belive that these are the only differences.

AWESOME - Thank you!