-
AuthorPosts
-
November 5, 2015 at 11:56 pm #531256
Hi, our site has a separate mobile theme that kicks into play for phones, but we lose a lot of Enfold’s beauty because the mobile theme doesn’t recognize the shortcodes, so we had to recreate each page separately for the mobile theme.
I’m working on fixing this so we can use Enfold for the mobile view as well, and have it mostly done on a test page.
I just have one more bug I can’t quite seem to figure out and am hoping for some assistance.
1. Part of the reason we had to use a separate theme was to add some buttons just for mobile (Call, Booking, Email etc). I have added a grid row below our header with this. Now am trying to move the mobile menu down so it is part of the grid. Right now, it’s just done with css, but is there a better way to do that? Can I add a call to the menu right in the cell?
Also, as part of this, is there an elegant way to add this content to all pages dynamically? We only want it to show on mobile.
Thanks for your help, I’m including web address and login privately so you can see what I’m doing.
November 6, 2015 at 12:39 am #531277You’ll be wanting to familiarise yourself with CSS @media queries as these are a pretty easy way of targeting content at specific devices and screen resolutions. It’s basically the key to all the responsive design.
If you look in the Enfold Child theme’s css you’ll see a section targetting mobile styles, wrapped thus:
@media only screen and (max-width: 767px) { /* Add your Mobile Styles here */ }
I use this to hide the layer slider on mobile devices by including the following:
.avia-layerslider { display: none; }You could do this with the ID of your extra mobile objects to hide/show them as appropriate.
November 6, 2015 at 12:57 am #531294Thanks… Yes, I have the media queries set up but it’s not just a matter of showing and hiding. If you look at the page I’m referring to, the issue is moving the mobile menu, not hiding it. I can move it, but it’s positioned absolutely, so is a little clunky.
November 9, 2015 at 12:57 pm #532524Hi!
Quite difficult to understand fully what you mean and I don’t understand why you need any additional mobile theme (using a plugin? or how?), because Enfold is already fully responsive. If you want to hide/show any buttons only on mobile then you can simply use media queries as mentioned by @Richard Olpin. There is no need for any additional plugins I think.
Best regards,
AndyNovember 9, 2015 at 4:08 pm #532694Yes, Enfold is fully responsive, but I’m trying to add a set of buttons on each page under the header with quick access to important stuff, so people don’t have to click the menu to look for them. And it makes sense to move the menu button to that area. I was hoping to not have to hard code this on every page, so was looking for a better solution. Does that make sense?
November 11, 2015 at 1:18 pm #533976Hey!
so what are you trying to achieve? can you show us the result please? you can use imgur.com or dropbox.
Regards,
AndyNovember 13, 2015 at 3:50 pm #535467I sent you a link to a screenshot of what I’m working toward. Thanks.
November 18, 2015 at 1:22 am #537739Hey!
unfortunately that’s beyond our support scope, as written in our support policy and you would need to hire a freelance developer for this job.
Regards,
Andy -
AuthorPosts
- You must be logged in to reply to this topic.