Dicko
Dicko

Reputation: 1

Apply css to custom Wordpress template

I am trying to establish 2 x custom page templates for a site using Zerif Pro on Wordpress 4.7.3 I have created the template files but can't get the layout I want.

I am trying to get a full-width template where the content appears directly below the navbar.

Using inspect element I can edit the CSS to

.content-left-wrap {
   padding-top: 0px;
} 

And get the desired look, but I can't figure out what to change in my fullwidth.php file or where to put it.

Template Code Below:

<div class="clear"></div>
</header> <!-- / END HOME SECTION  -->

<?php zerif_after_header_trigger(); ?>

<div id="content" class="site-content"> 
  <div class="container">
    <div class="content-left-wrap col-md-12">
        <div id="primary" class="content-area">
            <main id="main" class="site-main" role="main">

                <?php 
                    while ( have_posts() ) : 
                        the_post();
                        get_template_part( 'content', 'page-no-title' ); 
                        /* If comments are open or we have at least one comment, 
                        load up the comment template */
                        if ( comments_open() || '0' !=  get_comments_number() ) :
                            comments_template();
                        endif;
                    endwhile;
                ?>

            </main><!-- #main -->
        </div><!-- #primary -->
    </div><!-- .content-left-wrap -->
</div><!-- .container -->

<?php
   get_footer();
?>

Upvotes: 0

Views: 103

Answers (1)

sansan
sansan

Reputation: 833

Edit fullwidth.php Add another class to this div like this

<div class="content-left-wrap wrap-new col-md-12">

and then add css to the template css file using the new class

.wrap-new
{
.content-left-wrap {
padding-top: 0px;
} 

}

Upvotes: 0

Related Questions