Hi,
I’m not sure what happened to my site, but my logo in my header shrunk in size and will no longer resize. I have it currently set to a max width of 350, but when I change it to 400, it does not size any larger. The logo uploaded is over 1200px so it should resize. It is also no longer centered in the header 
Would you be able to take a look please?
Thank you so much!!
Hello Kate,
Thanks for writing in! As I have inspected your page, I found out that you are serving the images using CDN. You will have to clear your CDN caches first and clear your Page Speed cache before you test your site again. If nothing is helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
To know how to create a secure note, please check this out: How The Forum Works
Best Regards.
Hi,
Yes, I am using a CDN - however the URL for the logo in the CDN (https://cdn.newmoonstrategy.com/wp-content/uploads/2020/11/07012718/Logo-MAIN-Large.png) seems to work and appear fine, it just isn’t rendering properly!
I have provided you with a login in the Secure Note. Thank you!
Hey Kate,
I tried to login but either the username or password is incorrect, please double check the credentials. However i checked the front-end of your site and there is a custom CSS added which is restricting your logo image to 125px only (see screenshot)
Please find and remove the above CSS to fix the issue. Let us know how this goes!
Hi Nabeel,
Thank you for the help! I found this CSS, it is actually placed in a footer widget area to display my Ethical Move logo in the footer. I removed the CSS and uploaded a smaller Ethical Move logo in the footer, but now this Ethical Move logo is NOT appearing correctly - it is resized to be extremely small on mobile.
Is there a way to have CSS for JUST this footer logo without affecting the logo in the header?
Thank you so much!
Hi Kate,
Your header and footer logo is not showing. Please fix it first so that we can help you with your concern.
Hope that helps.
Thank you.
Hi,
I am talking about the Ethical Move logo that is in the Footer Widget area on the website. It is the white circle that I added to the footer via HTML & CSS.
Thank you!
Hi Kate,
Your given credential is not working please recheck and send us again so that we can log in to the dashboard and check the logo issues properly. As the logo still not appearing on the fronted.
Thanks
Hi,
The logo is appearing on the front end, see attached screenshot.
This logo in the footer (The Ethical Move)
was originally uploaded at a large size on my website.I put the CSS in place to resize it to 125 px. This worked, but it affected the main New Moon Strategy logo in the header, which was not good.
I have removed the CSS which has fixed the main New Moon Strategy logo, but now I have no way of setting the size of the Ethical Move in the footer with CSS. I uploaded a smaller logo, but it is now displaying wrong on mobile and appears blurry, so I would like to go back to the large logo and resize it with CSS.
I have added new credentials for you in the secure note!
Thank you!
Hi Kate,
Just use the code below, to target the logo in the footer area.
.x-colophon .widget_text .image img {
width: 125px;
}
Please note that custom CSS code is outside the scope of our support. Issues that might arise from the use of custom CSS code and further enhancements should be directed to a third-party developer you can avail One where we can answer questions outside of the features of our theme.
Hope that helps.
Thank you.
Thank you for your assistance!
I am still having an issue on mobile - I am not sure why the image in the footer is resizing to be so small that it is not legible.
Hi Kate,
It seems that the CDN access blocked for a few countries, and as result, it is not able to load the images on your website. It shows 403 error and the notice is given below:
The Amazon CloudFront distribution is configured to block access from your country. We can’t connect to the server for this app or website at this time. There might be too much traffic or a configuration error. Try again later, or contact the app or website owner.
Can you please check and resolved this issue, so the logo can be visible at our end to diagnose the problem you are having with the mobile device.
Thanks
Hi,
I apologize for that error! Can you please try again? I adjusted settings and it should allow you to see it now.
Thank you!
Hi Kate,
The reason why your image in the footer is so small is because of the CSS you added, please check this out.
Hope that helps.
Thank you.
Hi,
I removed that 40% CSS but it doesn’t seem to be changing the size of the image at all on mobile
I really do appreciate all the help!
Hello Kate,
Your issue can be resolved by adding this custom CSS:
@media(max-width: 767px){
.x-colophon .widget_text .image img {
min-width: 125px;
}
}
You are having this issue because of your custom HTML content. It best that you use the Global Block in X > Global Block. Create a global block with section, row, and two columns, 1/4 + 3/4, where you can insert your image and your text. In the global block, it would be easier to manage the column width for each respective screen size. With the column width expanding, the image inside it will be much more responsive too. You can then save your block changes and then take note of the global block shortcode. You can insert this global block shortcode in the sidebar text widget. This method does not need any custom CSS or any HTML code to have the same result and yet responsive enough and super easy to edit when the time codes.
Kindly let me know if you want to have an example so we can make it for you.
Thank you! I did not know about the Global Blocks, that is very helpful to know 
I think I am all set and we can close the ticket! Thank you again for all of your assistance.
Hello Kate,
Glad that we were able to help you.
Have a great day!
Thanks
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.