Forum Replies Created
-
AuthorPosts
-
Hi Vinay
Thank you for your reply. With the css you provided, It looks perfect in small screen. I tried resizing the browser it looks greatbut it still looks like this in iphone. see this screenshot.
and also the text is not clickable, no links , no hover style.
This is all the css used in quick css to get this header widget right. May be it is a bit too much :) May be it needs a bit of clean up. Your help would be highly appreciated.
/* header widget for LARGE screen*/ #header .widget { font-size: 34px; line-height: 40px; position: absolute; right: 50px; top: 0; z-index: 100; height: 100%; margin: 0; padding: 0; text-align: right; } @media only screen and (min-width: 767px) { #header .widget{ max-width: 1210px; left: 0; right: 0; margin: 0 auto; } } #header.header-scrolled .widget{ font-size: 23px; line-height: 30px; } #header .widget .textwidget, #text-2{ display: table; width: 100%; height: 100%; float: right; z-index: -999 !important; } #header .widget .textwidget .custom-text{ display: table-cell; vertical-align: middle; } #header .custom-text .icon{ font-size: 42px; } #header.header-scrolled .custom-text .icon{ font-size: 32px; } #header .custom-text .icon span{ float: none; display: inline-block; margin-left: 0; margin-right: 9px; } #header .widget .custom-text p, #header .widget .custom-text a{ font-weight: bold; color: black; margin: 0; } /* header widget anchor text hover, it affects social icons too*/ #header .widget .custom-text a:hover{ color: green; } /* header widget for MEDIUM screen*/ @media screen and (max-width: 989px) and (min-width: 767px) { #header .widget { font-size: 26px; } #header .custom-text .icon{ font-size: 40px; } } /* header widget for SMALL screen*/ @media screen and (max-width: 767px){ #header .widget { font-size: 14px; line-height: 24px; right: 100px; padding: 0; } #header .custom-text .icon{ font-size: 26px; } .responsive .logo, .responsive .logo a { height: 200px !important; } .responsive .logo img{ height: 180px !important; } } /* .content { padding-top: 10px; padding-bottom: 10px; } */ .main_menu { left: 0px; right: auto; height: 0px; display: none; } .special_amp { font-family: inherit; font-style: normal; font-size: inherit; line-height: inherit; font-weight: bold; color: inherit!important; } /*footer image media query*/ @media screen and (max-width: 720px) { .textwidget img.avia_image { margin-right: 100px; } } #text-2 { right: 100px !important; margin-right: 0px !important; } /*reduce color box top padding*/ .content { padding-top: 10px; padding-bottom: 10px; } /* added */ #header .widget .textwidget, #text-2 { display: table; width: 35%; height: 100%; float: right; display: inline-flex; padding: 45px 0px 0px 0px; } #header.header-scrolled#header .widget .textwidget, #text-2 { display: table; width: 35%; height: 100%; float: right; display: inline-flex; padding: 10px 0px 0px 0px; margin-left: 100px; } @media screen and (max-width: 1900px) and (min-width: 989px) { #text-2 { right: 40px !important; margin-right: 0px !important; } } @media only screen and (max-width: 766px) and (min-width: 480px){ #text-2 { right: 100px !important; margin-right: 0px !important; } } @media screen and (max-width: 767px){ #header .widget { font-size: 14px; line-height: 24px; right: 130px; padding: 0; } #header .custom-text .icon{ font-size: 26px; } .responsive .logo img{ height: 140px !important; } } @media screen and (max-width: 480px) { .responsive .logo img { height: 90px !important; } .responsive #top #wrap_all .container { width: 99%!important; max-width: 99%!important;}}
Hi
I have managed to fix it except for small mobile scree. please look at the screenshot i provided in private section.
Mobile number is broken down to 3 paragraphs, and unnecessary padding on top and bottom. can you please help me fix it.You see this only on iphone (in android looks ok), If you only resize the google chrome browser, it does not look like that.
Also, Just noticed that when i scroll the page slowly, the widget appear on top of body. please see the screenshot.
All I am really looking for is a text widget with icons on the right, properly aligned with the logo and be responsive on page scroll and different screen sizes. But it has taken weeks for me and also asked you guys many times for the same issue over and over again.
Can we fix it once, so that we don’t have to deal with this issue again.
Thank you
- This reply was modified 8 years, 6 months ago by kaloraat.
Hi Jordon,
The text widget is sitting far right from the body content. We cant leave it like that too. I am not sure what change have you made but can you please restore it the way it was before. I spend more than a week, posted several time for support to get that right.The only issue that came up all of a sudden was that logo was not clickable. Please help me restore the way it was before. Then we can focus on making the logo clickable.
Thank you.
Hi Jordan,
Yes it is clickable but the test widget has no more space on top. Before it had white space on top, was aligned horizontally with the logo and looking good. can you please make it same as before. text widget need white space on top.I tried to put margin-top on the textwidget but on page scroll the widget appears on top of body text. please make it same as before and we should keep it responsive too for all screen size and also on page scroll.
Thanks!
Hi Jordan,
Thanks for your quick response. However the code you provided made no difference. With the existing code it was working perfectly fine until few days ago. Not sure what happened.You are awesome :)
Thanks a lot for your help.Thank you Josue. One last thing, Is it possible to keep it within the same width as body content, currently it is pushed far right to the edge of screen. That is what I see in big screen.
Cheers!
Hi Josue,
Thanks. Right aligned, looks good but it appears like this in iphone6. I clear browser history and website data but thats how it looks. Please see this screenshot.
Social icons falls down from the header section to body.
http://prntscr.com/bddjekHi Josue,
Also on mobile screen, the icons overflows the header section and appears on top of body text.
Please see this screenshot.Thank You
Hi Josue,
Thank you very much. Looks a lot better. Is it possible to make the text and icons all right aligned? And also a bit more padding on top of the icons, they look too close?That would be great!
Hi Ismael
The issue is fixed. Yigit helped me fix it, thank you for your response! You can close this thread now.
Cheers!
Hi
Yes, you can close this thread as resolved.Cheers!
Hi Yigit,
This is a much better solution than the ones I got for days, Thanks for your time and effort. You are a champion. It was great to hear from you.Cheers!
Hi Vinay,
All other threads are closed by Andy, Didnt you see that? He could not help me. He helped me with cheap tricks that ultimately fails such as unclickable logo, non-responsive header etc. Check the last thread if you want. The link is provided above.Please read the ticket above twice and provide me a solution. I have wasted many days on this issue. I have provided the screenshots of the problem, screenshots of the desired solution and the login details.
I was expecting a solution from you, not a complaint about opening too many threads. THEY ARE CLOSED! I surely dont want to waste my time opening new tickets, give me the solution. Please!
June 2, 2016 at 12:42 pm in reply to: header with logo left, address right, menu below and make it responsive #642007Just letting you know, I update the theme. No difference.
Anyway, you can close this thread. Thanks
June 2, 2016 at 12:24 pm in reply to: header with logo left, address right, menu below and make it responsive #641990Hi
Yes it is responsive. The problem is:
Issue 1. I cant click logo, it is not clickable. Try yourself. I think the right side widget is sitting on top of the logo element or something wrong!Issue 2. Social icons appears on top of body. It is not contained within header. It does need to shrink with the header element on page scroll. Cant leave it flow out of header can I?
This header widget is supported by enfold, not something i am trying to customize beyond theme’s ability.. But it has to not only look right but perform right too. Logo is not clickable because of this widget. It also does not contain all the elements within header, try scrolling page up and down visit page. This is extremly sad! I will update theme but it is clear that these issues are not theme update related.
Please fid\x this.
Thank you.June 2, 2016 at 11:28 am in reply to: header with logo left, address right, menu below and make it responsive #641962Well Andy, It’s not a different issue. It is the same issue!!
All I am asking is a header with logo left and and a text widget right. And Make it responsive on mobile and on page scroll.And you are telling me to hire a freelancer for that? Why are you suggesting me to update theme? Will that fix my issues?
Please be clear when answering, I am spending days for such a basic task.
I was proud of having enfold but you have proved me wrong, If you are not interested in answering please dont. I would be lucky have my questions answered by someone else!
June 2, 2016 at 4:02 am in reply to: header with logo left, address right, menu below and make it responsive #641787Hi
Waiting for someone to help..Thanks!
Hi
Waiting for someone to help..Thanks!
June 1, 2016 at 1:28 pm in reply to: header with logo left, address right, menu below and make it responsive #641468It worked, However the logo image is not clickable. Only the lower bottom of the logo image is clickable and completly unclickable on page scroll (while the header is shrinked).
Please give me css to make the whole widget custom-info behave the same way as logo, shrink on top within the header on page scroll.
Please see yourself at:
riseuptours
I have provided the login details in this thread, if you need to login to the website.Thank you
- This reply was modified 8 years, 6 months ago by kaloraat.
June 1, 2016 at 12:29 pm in reply to: header with logo left, address right, menu below and make it responsive #641419Hi
The code does not work, please have a look at this screenshot. I want to completly remove the space above the logo and address bar in the header.June 1, 2016 at 10:55 am in reply to: header with logo left, address right, menu below and make it responsive #641372Hi Andy,
I almost fixed it however, the padding on top of header is an issue now. How to get rid of the padding on top of header (logo and address widget)?Thanks!
Hi Vinay,
Thank you very much, However the logo image is not clickable. Only the lower bottom of the logo image is clickable and completly unclickable on page scroll (while the header is shrinked).
Please give me css to make the whole widget
custom-info
behave the same way as logo, shrink on top within the header on page scroll.
It is also no longer responsive since i have added social buttons(they must be there, clients request!) together with address, cant see in mobile.Please see yourself at:
riseuptours
I have provided the login details in this thread, if you need to login to the website.Thank you
- This reply was modified 8 years, 6 months ago by kaloraat.
May 31, 2016 at 1:25 pm in reply to: header with logo left, address right, menu below and make it responsive #640908I have also supplied my login detail in this thread as private. Please use that if necessary, Thanks
May 31, 2016 at 1:23 pm in reply to: header with logo left, address right, menu below and make it responsive #640906Hi Andy,
When I scroll the page this is how text widget appears on top of the body text, I want to make it shrink with logo and stay inside header element.
Please see the screenshot
http://prntscr.com/ba5x5etext widget gets cut off in mobile screen, I want it to go below logo in mobile
Please see the screenshot
http://prntscr.com/bak439Thank you very much.
May 31, 2016 at 12:23 pm in reply to: header with logo left, address right, menu below and make it responsive #640869Hi Andy,
All I want is make this address widget behave with the logo. when the logo shrinks, I want it to shrink to the similar level. And make it responsive, It is cutting off.I am sure you can help me with this, Dont worry about other small issues, I will try myself but this is the most important. Or else the website is useless. Just want to make it responsive for mobile and behave with the logo.
Please try again. I am waiting for your response.
Thank you!
May 31, 2016 at 10:43 am in reply to: header with logo left, address right, menu below and make it responsive #640804Hi
Can please someone help me get this right?Thank you!
May 30, 2016 at 2:33 pm in reply to: header with logo left, address right, menu below and make it responsive #640395Hi Yigit,
You are legend! I am very happy to get your quick response. Please have a look at this link. When i scroll the page, the logo gets smaller however address on the right side dont and overlaps the body text. I want to add social icons just below address in the same widget too.Is it possible to make it shrinkable and responsive the same way as logo with all the content still visable? May be with a slight drop shadow? Here is the link and screenshot.
http://www.riseuptours.com.au/sri-lanka/
Also, Is it possible to make the address widget go under the logo in mobile? In mobile screen it is still cutting off.
I also need to hide menu icon on mobile devices.
Is it possible to have other icons on image hover than default circle with right pointing arrow lcon?
Is it possible to display search box somewhere but not with menu, I have menu display none at the moment.
I am sorry but I cant change the pipe’s color to black between the links in footer. They are faded grey at the moment. Please see this screenshot. http://prntscr.com/ba66cf
padding seems too big between header and body, maybe because i have done display:none to menu. Is there a way to reduce the padding there?
Hope to hear from you soon!
Thank you for your great support!- This reply was modified 8 years, 6 months ago by kaloraat.
Hi Rickard
Please visit the link. This is how i want it to look like however the way i have achieved it is not right. I have build the whole thing from top to bottom using the page builder from inside the page.It will not be practical in the long run, is it possible to get the exact header and footer look like that?
logo left address right using the standard header so that it appears in all pages and regular menu with links in the footer.cheers!
May 12, 2016 at 12:14 pm in reply to: google cant find my blog even when i post my url in google search? #631294I tried everything such as fetch as google and sitemaps. I previously encountered a problems with seo yoast generating xml sitemap.
When i click to sitemap it appeared page not found. Then a while ago i tried again and it actually showed me the sitemap, then i submitted it to google.
I still cant solve the problem with image not being shown when the link shared in facebook. I uploaded an image just for the page and using yoast and share but still no image shown. Facebook developers page shows me an error saying image is bigger than 8mb which is not true. It also ask me to put some code in the head section (including javascript) which i have no idea!
previously it was showing image in facebook link share if i upload image to that particular page using yoast. but now i have to put code in the header?? i dont get it.
And also it never showed the image in facebook share even when there were many images in pages. I had to upload it manually using yoast plugin.Yoast plugin also dont understand a lot that is going on in page such as it finds no image h1, h2 elements etc. Is there a better seo plugin that works well with enfold?
please see the attachments.
Please help, Cheers!
- This reply was modified 8 years, 7 months ago by kaloraat.
-
AuthorPosts