jimjimmy Posted February 8, 2020 Share Posted February 8, 2020 (edited) Site URL: https://www.jimisaband.com/ Hello! I have placed a logo in my footer and it looks fine on desktop but is HUGE on mobile. It takes up the entire mobile screen. Any ideas on how I can fix this? website is jimisaband.com The template I used it Kitui, a 7.1 template Edited February 8, 2020 by jimjimmy Link to comment
0 tuanphan Posted October 14, 2020 Share Posted October 14, 2020 20 hours ago, HannahJaneEalu said: hi guys i am having the same issue with my site could someone assist? logos on mobile are massive - is there a way to reduce them or introduce a sliding carousel of multiple images? www.ealuexperiences.com I see you used carousel. Do you still need help on this? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 Praneetha Posted October 28, 2020 Share Posted October 28, 2020 Hi @tuanphan hoping you can help me once again. I'm using the code below to adjust the height of my logo in footer in the mobile view but there's a space between the logo and the last section. Any chance you can help me rework this? @media screen and (max-width:640px) { div#block-yui_3_17_2_1_1603837109718_13061 img { width: 30% !important; height: auto !important; transform: translateX(-50%); left: 50% !important; } div#block-yui_3_17_2_1_1603837109718_13061.image-block-wrapper { padding-bottom: 50% !important; } } Link to comment
0 tuanphan Posted October 28, 2020 Share Posted October 28, 2020 1 minute ago, Praneetha said: Hi @tuanphan hoping you can help me once again. I'm using the code below to adjust the height of my logo in footer in the mobile view but there's a space between the logo and the last section. Any chance you can help me rework this? @media screen and (max-width:640px) { div#block-yui_3_17_2_1_1603837109718_13061 img { width: 30% !important; height: auto !important; transform: translateX(-50%); left: 50% !important; } div#block-yui_3_17_2_1_1603837109718_13061.image-block-wrapper { padding-bottom: 50% !important; } } Can you share site url? We can check easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 Praneetha Posted October 28, 2020 Share Posted October 28, 2020 (edited) Yes - here's the website @tuanphan https://www.calligrapran.com/ thank you! The logo in the mobile view is smaller, but there's all this extra space I'm not able to remove - pic attached Edited November 3, 2020 by Praneetha Link to comment
0 TLB Posted November 4, 2020 Share Posted November 4, 2020 Hi. I'm quite new to all this but I had a similar problem on my site where I wanted the logo on the footer to be smaller than the header logo on mobile. I found a way of cheating it by adding some extra transparent space to the sides of the logo .png file that appears on the footer. That way when the logo image is displayed full screen on mobile it looks smaller as it includes the blank pixels to the sides. It takes a bit of tinkering back and forth to get right tho. If you want you can then adjust the content width of the footer block and/or add spacers so the footer and header logo appears the same size on desktop but smaller on mobile. May not be the best method but works for me so far! Link to comment
0 tuanphan Posted November 4, 2020 Share Posted November 4, 2020 On 10/28/2020 at 8:42 AM, Praneetha said: Yes - here's the website @tuanphan https://www.calligrapran.com/ thank you! The logo in the mobile view is smaller, but there's all this extra space I'm not able to remove - pic attached Remove your code I mean this code @media screen and (max-width: 640px) { div#block-yui_3_17_2_1_1604423224567_14991 img { width:30% !important; height: auto !important; transform: translatex(-50%); left: 50% !important } div#block-yui_3_17_2_1_1603837109718_13061.image-block-wrapper { padding-bottom: 50% !important } } and add new code @media screen and (max-width:640px) { div#block-yui_3_17_2_1_1604423224567_14991 { width: 30%; margin: 0 auto; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 Praneetha Posted November 4, 2020 Share Posted November 4, 2020 Thank you @tuanphan you are truly the best!! Link to comment
0 tuanphan Posted November 6, 2020 Share Posted November 6, 2020 On 11/5/2020 at 4:54 AM, Praneetha said: Thank you @tuanphan you are truly the best!! I see the boxes is not equal height. Do you want fix? Praneetha 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 RM-WB Posted November 11, 2020 Share Posted November 11, 2020 Hi @tuanphan i need help with making my footer logo smaller too. https://playbookpo.squarespace.com pw: playbook2020 Link to comment
0 tuanphan Posted November 11, 2020 Share Posted November 11, 2020 8 minutes ago, RM-WB said: Hi @tuanphan i need help with making my footer logo smaller too. https://playbookpo.squarespace.com pw: playbook2020 Incorrect password Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 RM-WB Posted November 11, 2020 Share Posted November 11, 2020 5 minutes ago, tuanphan said: Incorrect password it should work now Link to comment
0 tuanphan Posted November 11, 2020 Share Posted November 11, 2020 4 hours ago, RM-WB said: @tuanphan sorry it should work now Add to Home > Design > Custom CSS /* resize footer logo */ @media screen and (max-width:767px) { div#block-yui_3_17_2_1_1605038351364_14663 { width: 50%; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 RM-WB Posted November 11, 2020 Share Posted November 11, 2020 6 hours ago, tuanphan said: Add to Home > Design > Custom CSS /* resize footer logo */ @media screen and (max-width:767px) { div#block-yui_3_17_2_1_1605038351364_14663 { width: 50%; } } that worked thanks @tuanphan Link to comment
0 tuanphan Posted November 12, 2020 Share Posted November 12, 2020 17 hours ago, RM-WB said: that worked thanks @tuanphan On mobile, the image is not fullsize, you can add this to Design > Custom CSS to solve /* resize mobile banner */ @media screen and (max-width:767px) { .homepage #page section:first-child { min-height: 25vh !important; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 brianjames Posted November 12, 2020 Share Posted November 12, 2020 @tuanphan I hate to ask, but I'm having trouble getting this to work on my site as well. I've gone into inspector to get the Block # for the logo in my top footer and tried to swap the ID number, but it's still not working. Perhaps I have the wrong Block #? I'd really appreciate your help with this! http://medicinepathpodcast.com Link to comment
0 tuanphan Posted November 14, 2020 Share Posted November 14, 2020 On 11/13/2020 at 3:37 AM, brianjames said: @tuanphan I hate to ask, but I'm having trouble getting this to work on my site as well. I've gone into inspector to get the Block # for the logo in my top footer and tried to swap the ID number, but it's still not working. Perhaps I have the wrong Block #? I'd really appreciate your help with this!http://medicinepathpodcast.com Add to Home > Design > Custom CSS /* resize footer */ @media screen and (max-width:640px) { div#block-yui_3_17_2_1_1605211543446_3847 { width: 50%; margin: 0 auto; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 CarissaBlossom Posted November 21, 2020 Share Posted November 21, 2020 @tuanphan I'm having the same issue with the logo appearing way too big in the footer, can you help me? www.carissablossomartistry.com Link to comment
0 tuanphan Posted November 21, 2020 Share Posted November 21, 2020 3 minutes ago, CarissaBlossom said: @tuanphan I'm having the same issue with the logo appearing way too big in the footer, can you help me? www.carissablossomartistry.com Add to Home > Design > Custom CSS /* resize footer logo */ @media screen and (max-width:767px) { div#block-yui_3_17_2_1_1603244151885_6814 { width: 50%; margin: 0 auto; } } CarissaBlossom 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 tuanphan Posted November 21, 2020 Share Posted November 21, 2020 4 minutes ago, CarissaBlossom said: @tuanphan I'm having the same issue with the logo appearing way too big in the footer, can you help me? www.carissablossomartistry.com Also, I just had a quickly check. I see 1. (Mobile) Site title is too long, users can't see burger menu. Do you want to resize site sittle on mobile only? CarissaBlossom 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 CarissaBlossom Posted November 21, 2020 Share Posted November 21, 2020 @tuanphan yes please!! Link to comment
0 CarissaBlossom Posted November 21, 2020 Share Posted November 21, 2020 8 minutes ago, tuanphan said: Also, I just had a quickly check. I see 1. (Mobile) Site title is too long, users can't see burger menu. Do you want to resize site sittle on mobile only? Yes please!! Link to comment
0 tuanphan Posted November 21, 2020 Share Posted November 21, 2020 6 hours ago, CarissaBlossom said: Yes please!! Add to Home > Design > Custom CSS /* site title mobile */ @media screen and (max-width:640px) { span.site-title { font-size: 14px; } } CarissaBlossom 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
0 CarissaBlossom Posted November 21, 2020 Share Posted November 21, 2020 7 hours ago, tuanphan said: Add to Home > Design > Custom CSS /* site title mobile */ @media screen and (max-width:640px) { span.site-title { font-size: 14px; } } Thank you SO MUCH Link to comment
0 bexarmy Posted November 30, 2020 Share Posted November 30, 2020 Hello, sorry I'm another one asking for the big-Logo-in-footer-on-mobile support! I have a couple of logos in there. My site is www.holtbyjonpeake.co.uk Thank you! Link to comment
0 Praneetha Posted November 30, 2020 Share Posted November 30, 2020 Hi @tuanphan yes I'd like some help with making the padding even across those boxes. If you could help with css that would be amazing! Link to comment
Question
jimjimmy
Site URL: https://www.jimisaband.com/
Hello! I have placed a logo in my footer and it looks fine on desktop but is HUGE on mobile. It takes up the entire mobile screen. Any ideas on how I can fix this?
website is
jimisaband.com
The template I used it Kitui, a 7.1 template
Edited by jimjimmyLink to comment
Top Posters For This Question
59
7
5
4
Popular Days
Nov 21
7
May 20
6
Nov 11
5
Apr 22
4
Top Posters For This Question
tuanphan 59 posts
imikej 7 posts
Praneetha 5 posts
Tami21 4 posts
Popular Days
Nov 21 2020
7 posts
May 20 2020
6 posts
Nov 11 2020
5 posts
Apr 22 2020
4 posts
Popular Posts
tuanphan
Add to Home > Design > Custom CSS. Adjust logo size with width: 30% @media screen and (max-width:640px) { div#block-yui_3_17_2_1_1581102763124_24811 img { width: 30% !important; heig
tuanphan
Add to Home > Design > Custom CSS @media screen and (max-width:767px) { div#page-section-5ebf1213dfce295700786cb8>.row>.span-3 { width: 30% !important; } }
tuanphan
Add to Home > Design > Custom CSS @media screen and (max-width:767px) { div#page-section-5eba7c3d0c8cd57a536f9ae7 .span-9 .span-2 { width: 30% !important; margin: 0 auto; } }
Posted Images
137 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment