Tagged: enfold, fixed width sidebar
-
AuthorPosts
-
January 25, 2015 at 1:54 am #385035
I am trying to get a test site I’m working on to have a fixed width sidebar of 300px and let the main content area be responsive around that as the screen size shrinks until the side bar drops off at mobile width. The purpose of the sidebar on the site is to have social media links at the top with a 300px wide AdSense ad directly below.
Right now I have the content/sidebar grid set to 73%/27% on a boxed 1310px page width.
The problem is once the screen starts to shrink it cuts off the side of the AdSense ad because the ad has a fixed width value of 300px wide. I can fix the issue with a 160px wide ad instead but then I end up with an extra 140px of white space on the full screen version and those ads are less effective than the 300px wide ones.
Is there a way to do this with Enfold?
Thanks
JonJanuary 26, 2015 at 6:33 pm #385678Hey Jon!
it’s difficult to imagine what you explain. We really need a the website to see and inspect it. Let us know when you are ready to show us the issue.
Cheers!
AndyJanuary 26, 2015 at 9:26 pm #385846Andy,
Thanks a bunch I found a patch solution by setting a bunch of rules in Quick CSS like this one@media only screen and (max-width: 1140px) and (min-width: 768px) { .responsive .container { width: 800px; } }
The site I am trying to switch to Enfold gets 300,000 monthly views so I want it to be good. I have a few other customizations that are probably along the lines of changing the theme.
Can I submit them here to get suggestions and a possible quote?
http://kriesi.at/contact/customizationJanuary 27, 2015 at 5:57 pm #386434Hey!
You can ask a quote from WorkPress from here – http://kriesi.at/contact/customization
Also, we do not mind helping with simple changes. As long as customizations are not heavy, feel free to post them here and we will see what we can do to help :)Best regards,
YigitAugust 21, 2015 at 10:02 am #491222I have the same problem. What I need is to fix the width in pixels, not percentages, of the sidebar. I have an advertisements 270px wide but if the browser windows is less than some size (i don’t know exactly the size), the ad starst to get clipped from the right side.
I think that I need to keep the size of the sidebar at 270 px at all times so this doesn’t happens.
Where I can set or patch this? Thanks for any help.
August 21, 2015 at 7:04 pm #491553Hi!
It seems that we could use a media query that forces the width of the entire sidebar width to be constant (325px).
We will need the a link to the exact page the adsense ad is on to ensure we’re providing the correct css.
Cheers!
DakeAugust 21, 2015 at 7:38 pm #491568The ads are served using “Advanced Advertising System” plug in and it needs to display in 270 px wide. How we can do that?
August 21, 2015 at 8:02 pm #491578@Jlgarcia, the solution that the Enfold staff laid out above has worked great for me with my popular travel website http://www.bigboytravel.com
With any responsive website, a sidebar is going to work best with the boxed layout option instead of the full width. It looks like that’s what you are using already. Keep in mind that even with the solution above you will have to have your sidebar about 20% wider than your ads on the dekstop version to make sure they are not totally cut off when the width gets squeezed.
Biggest question I would have is why are you using that plugin for your side bar ads instead of just pasting code into the sidebar widget?
On another note, the more successful ads sizes range from 300 to 338 pixels wide in a side bar so I’m not sure what you’ll be able to accomplish with 270.August 21, 2015 at 8:39 pm #491594I don’t get what solution you are referring to above.
The Enfold theme only option that I found is to use percentages in the size of content + sidebar.We are using a plug in because we are managing local clients directly. We are pasting the code of the plug in directly in a text widget, it sends the banners as supposed to, but the problem is that the ads get clipped at the right at certain sizes.
The ads could be bigger as you say, but it will be clipped the same.
Another Solution would be that the ad wouldn’t be clipped in the first time. That can be done easier?
Thanks for your help.
August 25, 2015 at 11:07 am #492789Hey!
you can use media queries with a code something like this:
@media only screen and (max-width: 736px) { .sidebar { 270px !important; }}
Adjust it as needed to control sidebar width on mobile.
Regards,
Andy -
AuthorPosts
- You must be logged in to reply to this topic.