Support » Themes and Templates » Twenty Fourteen Full width pages

  • Extended the Twenty Fourteen theme, as I wanted to be able to make use of the whole page when using the full-width-page template. This theme solves this. It is set up as a child theme so it is small and easy to use.

    You can see it in action on my site:
    http://www.nexcius.net/minecraft/.

    It can be downloaded here:

    [link removed]

Viewing 15 replies - 1 through 15 (of 19 total)
  • Have you considered submitting your theme to the WordPress.ORG theme repository?

    http://wordpress.org/support/topic/adding-your-theme-to-the-wordpressorg-repository?replies=1

    That ensures that any theme available on this site meets WP standards.

    Can someone tell me why the link was removed in Nexcius post? His site is doing what I want mine to do but I can’t get there.

    Any help?

    Thanks.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    The link was removed because it (the Child Theme) was incorrectly released to the WordPress.org community.

    Thread Starter Nexcius

    (@nexcius)

    I am sorry to say that the theme was not approved by the reviewers as this does not modify anything else than the CSS.

    sassyneedle: As the download link was removed, I have made sure that it is easily available on the right hand side on the front page of my website mentioned above.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    If it’s just CSS you can use PasteBin to share it: http://pastebin.com/

    Thread Starter Nexcius

    (@nexcius)

    Great point, Andrew!

    The CSS is now available here: pastebin.com/80u0kqtv

    For anyone who is still interested in this topic, I have made a few small adjustments to Nexcius’s theme, to extend the Twenty Fourteen to a complete Full Width layout.

    The layout can be seen on my own site at http://www.willtaylor.org.

    Just create a child theme using the CSS from the Pastebin link above, then add the following lines:

    /*This section sets page to 100% width */
    .site {
    	background-color: #fff;
    	max-width: 100%;
    	position: relative;
    }
    /*This section sets page header to 100% width */
    .site-header {
    	background-color: #000;
    	max-width: 100%;
    	position: relative;
    	width: 100%;
    	z-index: 4;
    }
    GeoCreo

    (@geocreo)

    Is there any way in which I can achieve the same effect using custom CSS in a CSS plugin?

    esmi

    (@esmi)

    @geocreo: If you require assistance then, as per the Forum Welcome, please post your own topic.

    This topic references an old version of WordPress.

    lightrail

    (@lightrail)

    Thanks, guys — this was helpful to me. I needed to make one page on a site full width without changing the default page width for the rest.

    I installed the SuperSlider-Perpost-Code plugin to give me custom CSS per page. Then I pasted in the css so helpfully provided by Nexcius and B16WLL. Voila! Results at http://www.treesdecatur.org/events/

    Cheers!

    Hey! It doesn’t work on my page 🙁 Can anyone help me?

    I insert this to my child theme:

    .site {
    background-color: #fff;
    max-width: 100%;
    position: relative;
    }
    .site-header {
    background-color: #000;
    max-width: 100%;
    position: relative;
    width: 100%;
    z-index: 4;
    }
    .site-content .entry-content,
    .site-content .entry-summary,
    .site-content .entry-meta,
    .page-content {
    margin: 0 auto;
    max-width: 800px;
    }

    which made it a little bit bigger but it’s still not full screen on my browser. Looks like it’s still 1260 or something, tried it in different browsers and on diff computers but there are always side margins on both sides, does anyone know why? Thanks in advance !

    Would love some help on how to achieve this look! 😀

    For anyone who is still interested in this topic, I have made a few small adjustments to Nexcius’s theme, to extend the Twenty Fourteen to a complete Full Width layout.

    The layout can be seen on my own site at http://www.willtaylor.org.

    Just create a child theme using the CSS from the Pastebin link above, then add the following lines:

    /*This section sets page to 100% width */
    .site {
    background-color: #fff;
    max-width: 100%;
    position: relative;
    }
    /*This section sets page header to 100% width */
    .site-header {
    background-color: #000;
    max-width: 100%;
    position: relative;
    width: 100%;
    z-index: 4;
    }

    I’ve put the entire style.css from my theme as a Pastebin post.

    http://pastebin.com/sCvgR17F

    On my (working) setup it is the only file (other than screenshot.png) in a directory called “twentyfourteen-child” at the following location as per WordPress Child Theme instructions:

    “myWordPressFolder/wp-content/themes/twentyfourteen-child”

    If this doesn’t work then I’m not sure what to suggest!

    Hi B16WLL, I’ve put your CSS into my site to extend the page width as I was also struggling with this. I’m new to WordPress and just trying to get the basics of the layout right at the moment. It seems to have half-addressed the problem – but my header isn’t resizing. I see that it’s also set to 100% width in the CSS. The image was originally automatically resized to fit the old settings, but I’ve reuploaded the image and it should be large enough to fill the width of the screen, even if I need to crop it down to make it relative to the stretched width. Any ideas?
    http://freetobefamily.com/

    Forget my post from yesterday – I’ve changed to a different theme!

Viewing 15 replies - 1 through 15 (of 19 total)
  • The topic ‘Twenty Fourteen Full width pages’ is closed to new replies.