Skip to main content

Astra

  • sticky header
  • In the Astra Options -> Additional CSS, Add the following:
/*Make Header Sticky*/
.site-header {
    position: fixed;
    top: 0;
    width: 100%;
}

/*Adjust Content Padding*/
.site-content {
    padding-top: 170px;
}

/*Adjust Content Padding for Mobile*/
@media (max-width: 800px) {
    .site-content {
        padding-top: 100px;
    }
	/*Stick the Off-Canvas Navigation Menu - Adjust Top Margin for your Layout*/
		.main-navigation {
				position: fixed;
				margin-top: 0px;
	}
}

/*Adjust Content Padding for Mobile*/
@media (max-width: 650px) {
    .site-content {
        padding-top: 150px;
    }
	/*Stick the Off-Canvas Navigation Menu - Adjust Top Margin for your Layout*/
		.main-navigation {
				position: fixed;
				margin-top: 60px;
	}
}

template page without header​

  • Create a page-cleanpage.php file and put inside the theme's folder
  • Upload the file to your WordPress theme folder
  • Select the template in the WordPress page editor
<?php
/**
 * Template Name: Clean Page
 * This template will only display the content you entered in the page editor
 */
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo( 'charset' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?php wp_head(); ?>
</head>
<body class="cleanpage">
<?php
    while ( have_posts() ) : the_post();  
        the_content();
    endwhile;
?>
<?php wp_footer(); ?>
</body>
</html>