-
Posts
-
On pages that I choose to use the default editor instead of the avia builder I would like to have a certain width set for the entry-content. I keep trying to set the width but then all my avia advanced layout builder pages all shrink down as well. Is there a CSS class that I am missing to allow me to apply style to single pages that are built with the default editor?
Or is there a place in the template where I could easily add that class?
Thanks in advanced.
Raleigh
Hey pageladder!
Thank you for visiting the support forum!
The default editor, set with a right sidebar, should have the .entry-content enclosed on this selector:
div.container_wrap.container_wrap_first.main_color.sidebar_rightIf there are no sidebar, you can use this:
div.container_wrap.container_wrap_first.main_color.fullsizeRegards,
IsmaelShould have clarified I’m using no sidebar.
I just tried:
div.container_wrap.container_wrap_first.main_color.fullsize {
width: 704px !important;
margin: 0 auto;
}With no luck :/
Just trying to get a page’s content to be centered and max-width 704 on pages I am not custom building with the avia layout editor.
I’ll keep tooling around but thanks for the response. Any other help is appreciated. -Raleigh
Hey!
You can use the WordPress page ID to target the selectors on that page and then it will only effect that one specific page.
With dev tools, inspect the page and look for the page-id-1234 on the #top selector. It’ll look a bit different depending on the page/post/plugin custom post type. For example, if you inspect this page here on the forums the page could be targeted like this:
#top.postid-263088 .some-selector {color: red; }That postid would be page-id-## on a page etc.
Cheers!
DevinRight – I thought about doing it that way but haven’t been able to figure out how to make that work for what I am trying to accomplish…
The difference being that if someone ‘non-developer’ went into wordpress and hit new page/post that they would not have to add any custom css to have that page/post display correctly. But when I set that on the default template it also scrunches down my avia layout builder templates.
So I could go the opposite route and and just set the width wider on the avia custom layout pages…
I’m gonna send a private reply with screencast so I don’t waste anymore of your time being unclear on what I am asking :)
Thank you – Raleigh
Hi!
Thank you for the update.
My bad! I forgot to mention that the selectors above are to differentiate between the pages that are not using the advance layout editor from the ones that does. You can use this:
#main div.container_wrap.container_wrap_first.main_color.fullsize .entry-content { width: 710px; margin: 0 auto; }Cheers!
IsmaelHey Ismael – I tried putting the above css on the first line of my custom.css and it has no effect on either layouts avia builder or classic editor.
Still no solution here but thanks so much for the help thus far.
I’ll reply private right after this with another 1 min screencast showing details.
Hi!
Thank you for the clip.
It works fine on my end. Do you mind providing the link to the actual page that is using the default editor?
Best regards,
IsmaelHey!
In the code on your site you do not have .container_wrap_first compared to the latest version 2.7 and the suggestions above. When looking at the head of your site it shows:
Debugging Info for Theme support:
Theme: Enfold
Version: 2.0
Installed: enfold
AviaFramework Version: 1.8.2
AviaBuilder Version: 0.3.1The current version of enfold is 2.7 which has a lot of updates, and that specific class could have been one of the changes. If you don’t want to update because of customizations or something you could try this plugin: http://wordpress.org/plugins/wp-post-styling/
It lets you create a custom style in the settings. Like choose a name, and then create some css. Then it allows you to choose to use it on a per page basis. This would give you more control over which pages you would like “shrink”. It would also mean you only add the code once in the settings and choose the desired class from a drop down under the post editor on the page rather than entering css by page id. It would also let you do it to pages with the visual editor as well if you wanted to.
So you simply give your new class a name like: 710px-width and then add the css: .entry-content { max-width: 710px; margin: 0 auto; }
Then on the page choose the 710px-width from the dropdown of custom classes you created.
Cheers!
ChrisHey thanks a ton Chris – Ah I did not realize my installation was out of date! I am going to try updating that first. I do have some customizations but I’ve logged them all. I’ll respond here once I’ve done that and let you guys know if I got it working correctly. Thanks again.
- The topic ‘Style single pages not being build with avia builder’ is closed to new replies.