Sydney Pro - Service background image not showing

Sydney Pro
#1

Hello Atheme,

I was wondering if it is possible to have background image for individual services.

In services I created an service and in page builder I applied a background image to the row and it didn’t show it. Then i removed the image from row background and went to siteorigen editor and applied the image to background. However both methods does not show the image.

I am looking to have the content for the service on the image instead of an icon.

Thanks in advance,

Amir

#2

Hello Amir,

You can alter the current service icon with any image of your choice by using CSS code. For example:


.widget_sydney_services_type_a .fa-camera-retro:before{
  content: ''; /* Remove default icon */
  display: block;
  width: 32px;
  height: 32px; 
  background-image: url('http://yoursite.com/path/to/your-image.png');
  background-size: contain;
  background-position: center center;
  margin-top: 17px;
}

This will replace the fa-camera-retro icon defined in the Service icon field in the Service info box.

Replace http://yoursite.com/path/to/your-image.png with your image address.

To apply extra custom CSS code to your site, add it to Appearance > Customize > Additional CSS from your site dashboard.

Regards,
Kharis

#3

Hello Atheme,

Thank you for your reply Kharis.

I have implemented the css code above to the siteorigen css plugin and included featured pictures to the pages of Services. The custom css will be changed later with simple css plugin. However, I am having the following issues on our Website

The pictures were too small so i changed the width & height to 100px and nothing changed.
Also, although I have the “center align content enabled” on row and “content alighment to center” on fp-service type a and yet the images are not aligned properly.

Could you also let me know how I would be able to have the service title written in the image and not above or under the image For services.

Not sure if I have to create a new post for this?

I am also trying to do the same thing with projects and I have the Sydeny FP-portfolio plugin in place. Also the images are set in Crelly Slider with the snippet code of portfolio put in place. However, it does not show the image?

Look forward to your information.

Thank you in advance.

Amir

#4

Hi Amir,

I am sorry for the delay. Since your site is currently being under construction mode and not available yet for public access, I can troubleshoot your configurations. Is there any other way for me to access it?

Regards,
Kharis

#5

Hello Kharis,

The maintenance mode is off.

Thank you,

Amir