Adjusting page width in custom template

6 replies
  • WEB DESIGN
  • |
Here's my page.

I want to know how I can adjust the width of this page to make it narrower than it currently is.

<?php
/*
Template Name: Sales Page
*/
//Display the header
get_header();
//Display the page content/body
if ( have_posts() ) while ( have_posts() )
{
the_post();
the_content();
}

//Display the footer
get_footer();
?>
#adjusting #custom #page #template #width
  • Profile picture of the author Istvan Horvath
    In that template you can NOT.

    Reason: you are calling the deafult header file and that will set the deafult stylesheet and starts the body tag of the page with whatever width is set as default.
    Signature

    {{ DiscussionBoard.errors[8327372].message }}
  • Profile picture of the author wags1970
    Hi there

    There is a way you can do this , i dont know how familiar you are with css etc but this is quite simple

    If you create 2 new files in your themes template named header-salespage.php and footer-salespage.php and copy your default header code and footer code to the respective new files, in the new files rename the divs or whatever is responsible for determining the width of your new header and footer files, then in your themes style.css find the css styling for your header and footer and copy each into the style.css and rename them to what you have changed the divs to and set each width to your liking

    In the sales page template wrap your content inside a div call it something like
    <div id="salespage-content">

    And add some css to your themes style css to determine the width this should work

    You need to change the get_header and get_footer to include your header-salespage.php and footer-salespage.php instead

    By doing it this way you can have different styles for your sales page while keeping the rest of your theme as it was

    If you are just wanting to have the content a different width while keeping the default header and footer you can just wrap your content inside
    <div id="salespage-content">
    Your content goes here
    </div>

    And add the following to your themes style.css

    #salespage-content {
    margin: 0 auto;
    width: 720px;
    }

    This will set your content to center at a width of 720 pixels

    Regards paul
    {{ DiscussionBoard.errors[8333649].message }}
  • Profile picture of the author yestyle
    Banned
    Control file style.css in wordpress theme folder, you will edit whatever you want on your wordpress website. It's very easy.
    {{ DiscussionBoard.errors[8333773].message }}
    • Profile picture of the author Istvan Horvath
      Originally Posted by yestyle View Post

      Control file style.css in wordpress theme folder, you will edit whatever you want on your wordpress website. It's very easy.
      That's a big lie...!

      If it was easy nobody would be here in this subforum asking similar questions. And in this case just modifying the CSS would not help: read the post above yours - need to modify/create template files, as well.
      Signature

      {{ DiscussionBoard.errors[8333848].message }}
      • Profile picture of the author yestyle
        Banned
        Originally Posted by Istvan Horvath View Post

        That's a big lie...!

        If it was easy nobody would be here in this subforum asking similar questions. And in this case just modifying the CSS would not help: read the post above yours - need to modify/create template files, as well.
        What's big lie ???

        style.css is default file of wordpress theme, where every layouts on wordpress template found there. Just opening that file, also find layouts in your template ( div, ul or html elements ) that you want and change in css file. I'm also a wordpress developer/theme developer so way that I showed above, it's best and easiest way to modify layouts on wordpress themes.

        Regards,
        {{ DiscussionBoard.errors[8333963].message }}
        • Profile picture of the author wags1970
          Originally Posted by yestyle View Post

          What's big lie ???

          style.css is default file of wordpress theme, where every layouts on wordpress template found there. Just opening that file, also find layouts in your template ( div, ul or html elements ) that you want and change in css file. I'm also a wordpress developer/theme developer so way that I showed above, it's best and easiest way to modify layouts on wordpress themes.

          Regards,
          If you want to change the look of the whole theme then yes its fine to edit the default css, but if you would like to have one page with completely different styling, editing the css without creating new files is not enough as the header and footer are called on each template, you can edit the wrapper/container etc via css but the whole theme will be affected, so new template files and css are needed

          Regards Paul
          {{ DiscussionBoard.errors[8334064].message }}

Trending Topics