- This topic has 14 replies, 2 voices, and was last updated 4 years, 3 months ago by
.
Dear support team,
we would like to make the following two inquiries:
1) We need a logo optimized for Retina displays. As soon as we upload the logo with a high resolution, it will be displayed too large. How can we best represent our logo?
2) We would like to completely deactivate the navigation in the mobile view or remove the search function.
Thank you in advance for your information.
Hi @retace,
I hope you are well today and thank you for your questions.
1) We need a logo optimized for Retina displays. As soon as we upload the logo with a high resolution, it will be displayed too large. How can we best represent our logo?
You can configure the logo size as displayed in the attached screenshots.
2) We would like to completely deactivate the navigation in the mobile view or remove the search function.
You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
nav#header-navigation-mobile { display: none !important; }Best regards,
Shufflehound teamThank you for the feedback.
- How can we configure the width of the logo?
- The navigation is still visibile in the mobile version.
How can we configure the width of the logo?
You can configure it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
#page-container .header-logo img { max-width: 200px; height: auto; }The navigation is still visibile in the mobile version.
Could you please share your site URL where it’s displaying so that I can troubleshoot it?
It is not working on your website because you are using custom header created using header builder that you can only change using header builder so please edit it in the header builder.
How can we change the mentioned position with header builder?
Is it possible to use any alternative?
Solution for this topic
You can edit it in the header builder or change the header layout as shown in the attached screenshots.
Yes, but now:
How can I change the logo sizes (height+width) and deactivate the navigation for mobile version?
As you can see on the page, the logo continues to be large and the navigation is displayed in the mobile view, despite inserting the code.
Does the Header Builder have to be deactivated?
How can I change the logo sizes (height+width) and deactivate the navigation for mobile version?
I have already answered your question above.
As you can see on the page, the logo continues to be large and the navigation is displayed in the mobile view, despite inserting the code.
Does the Header Builder have to be deactivated?
Yes, as said above it is not working on your website because you are using custom header created using header builder that you can only change using header builder and no custom CSS code or theme options work on it.
If you want the theme options and custom CSS code to work then do not use the header builder template but instead use any other pre-built header template as shown in the above shared screenshot.
Thank you for the response!
I am using the “Header 1” and also added the custom css code.
The logo is still displayed to big.
Solution for this topic
All other pages on your website are displaying fine except home page so please edit the page and make sure that you have set its header layout to Default as shown in the attached screenshot.
Now working. Thank you!
You are most welcome here 🙂
