Community Forums › Forums › Archived Forums › Design Tips and Tricks › Custom Width Landing page
- This topic has 10 replies, 3 voices, and was last updated 9 years, 6 months ago by Brad Dalton.
-
AuthorPosts
-
June 12, 2014 at 7:56 pm #109540joshuewaMember
Greetings.
I'm trying to make a landing page template that has my header and footer intact, sidebar widgets removed, and a centered text area of 720 pixels.
I've got everything figure out except for the centered text area.
Does anybody know off the top of their head the line or two of code needed to do that?
Thanks
http://braziliangringo.com/courses/June 13, 2014 at 10:24 am #109601Brad DaltonParticipanttext-align: center;
Please remove the shortcodes if they're displaying.
June 13, 2014 at 10:58 am #109604joshuewaMemberBut how do I reduce the page width to 720 pixels?
June 13, 2014 at 11:50 am #109608Brad DaltonParticipantGo into your page_landing.php file
Find the custom body class selector
Search your style.css file for the class and there you will find the value for the width which you can modify. Try using Firebug or Chrome if you want to test it in your browser first.
Example:
.custom-landing .site-inner { border: 1px solid #222; max-width: 700px; margin: 32px auto; margin: 2rem auto; padding: 48px 64px 0; padding: 3rem 4rem 0; }
This shows 700px width.
The EPIK themes CSS classes maybe different.
June 13, 2014 at 12:25 pm #109612joshuewaMemberI think I almost have it.
In the custom template I found this:
// Add custom body class to the head
add_filter( 'body_class', 'epik_add_body_class' );
function epik_add_body_class( $classes ) {
$classes[] = 'epik-landing';
return $classes;
}In the style.css I didn't find any reference of epik-landing
I put that code you gave me in the style.css and reference epik-landing. Still no dice.
Is there a specific place I have to put it within the style.css? Or maybe it's named something else?
Appreciate all the help so far.
June 13, 2014 at 2:27 pm #109623Brad DaltonParticipantTry this
.epik-landing .entry-content { width: 700px; margin: 32px auto; margin: 2rem auto; padding: 48px 64px 0; padding: 3rem 4rem 0; }
June 13, 2014 at 3:08 pm #109629Brad DaltonParticipantOctober 8, 2014 at 12:08 pm #127131ravendesignshopMemberI'm trying to change the width in the minimum pro landing page and my edits to the style sheet aren't working. I've targeted all of the following:
.minimum-landing .site-inner
.minimum-landing .wrap
.minimum-landing .content
The width refuses to change. I've tried an !important tag. I've tried changing color, etc just to see if I'm even targeting it right -- nothing.
When I inspect element, it shows me .minimum-landing .site-inner and when I make changes to that class in the browser, it changes. Any idea what I'm missing? Here's the URL if that will help:
http://tnrg.net/intercontinental-crossing/October 8, 2014 at 12:27 pm #127134Brad DaltonParticipantOctober 8, 2014 at 12:55 pm #127141ravendesignshopMemberI'm using W3 total cache and tried your recommendation. It's telling me "all caches successfully emptied" but I also get this error:
FTP credentials don't allow to delete folder /var/www/tnrg.net/wp-content/cache/config
W3 Total Cache Error: Files and directories could not be automatically created to complete the installation.
Please execute commands manually
or use FTP form to allow W3 Total Cache make it automatically.Do you think this is part of my problem?
October 8, 2014 at 8:43 pm #127175Brad DaltonParticipantIf your code changes work in your browser then it could be caching.
What happens if you delete the plugin?
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.