[Resolved] “Service” Theme Issues & Questions

[Toby]

Hi,
I’m currently building https://emmasfunerals.uk for a client using the “Service” theme from the Site Library, and have a few small queries & questions please:

1. When viewing the site on a smaller (thinner) browser window or mobile, the site identity logo in the top left gets replaced with the default “S” logo again for some reason. I’ve already replaced both the ‘Logo’ and ‘Retina Logo’, but the image still persists, loading from https://gpsites.co/service/wp-content/uploads/sites/58/service.svg still, somehow.

2. When viewing the site on a smaller (thinner) browser window or mobile, the 3-lines/Burger + “Menu” button in the top right is still displayed, even though there is no menu present. I’ve achieved the ‘no menu’ on desktop view by deleting the default menu and creating a new one in its place and just not adding anything to it. It’s worked on for the full site, but not the mobile site.

3. I’d like to remove the “Back to Top Button” completely, but the most I can do is set all the colours to transparent. Is there a way to completely remove this Back to Top button and not have it even included anymore on the site?

4. I’ve replaced the default picture on the homepage with a portrait as you can see, but how can I adjust the drop shadow that currently being applied to the bottom + right of the image? Things like the size of the shadow, the colour, and the distance etc.

5. When viewing the site on a smaller (thinner) browser window or mobile, the footer “Contact” widget is center-aligned for some reason. On desktop view it’s correctly left-aligned. I actually don’t have a problem with this, and I think it looks better like that on mobile view. But I was just wondering is this done automatically because I currently only have 1 widget? And if so, what will happen with future footer widgets on mobile? Will they appear next to the “Contact” widget, or below and also center-aligned?

Thanks!

[Elvin]

Hi,

1.) Mobile header uses its own settings for this. You can set the logo on Customize > Layout > Header. It’s under Branding Type when “logo” is selected on the dropdown.

2.) You can completely remove the mobile navigation by adding this code.

@media (max-width:768px){
#mobile-header > .inside-navigation > .menu-toggle, .main-nav {
	display:none;
}
}

3.) You should be able to remove this on Customize > Layout > Footer. You should see a Back to Top dropdown. Set it to disable.

4.) On Customize > Additional CSS, you should be to see a CSS code that looks like this:

.image-shadow img {
box-shadow: 15px 15px 0px #ededed;
}

You can change its values to your preference.

Example:

.image-shadow img  {
box-shadow: 15px 15px 20px rgba(20, 20, 20, 0.5);
}

This shadow uses the added rgba color value w/ set distance and blur levels.

5.) These are also found on Customize > Additional CSS. You should be able to see this CSS code there:

/* footer widget spacing */

@media (min-width:1025px) {
  .footer-widgets .footer-widget-1 {
    width: 65%;
		padding-right: 80px;
  }
  .footer-widgets .footer-widget-2 {
    width: 15%;
  }
  .footer-widgets .footer-widget-3 {
    width: 20%;
  }
}

@media (max-width:1024px) {
.footer-widgets .footer-widget-1,
  .footer-widgets .footer-widget-2,
  .footer-widgets .footer-widget-3 {
		width: 100%; 
    padding: 20px;
		text-align: center;
	}
}

Change this to the values you prefer. If you don’t change these, the widgets will stay text-align: centered.

[Toby]

Hi Elvin,
Thank you for the swift and perfect support!
All implimented and setup and site is now working perfectly. 🙂
Thanks again.

[Elvin]

Nice one.

No problem. We’re glad its working perfectly for you now.:)

[Author]

Posts