amanduhb52

I’ve removed this line of code from the header.php file in my child theme to remove the header text for now.

<div class="site-branding">
				<h1 class="site-title"><a href="<?php echo home_url( '/' ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
				<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
			</div>

Got it. I had made changes to the padding in:

.single .hentry, .error404 .hentry, .page .hentry, .search-no-results .no-results

and that messed up the mobile version.

Or does anyone know how to call up the mobile version of a site on a computer? Or use something like Firebug on an iPhone?

Thanks!

Surely.

Hi Caroline, can you offer insight as to what element to style to massage the new “untoggled” mobile menu?

Thank you!

Amanda

That sort of worked. It moved my sloppy circles to the middle of the page. It’s a start!

Sorry, that was a guess. You should probably start a new thread for this issue.

Banjer, I think you need to include this code on your index.php file:

<?php query_posts('post_type=category'); ?>

So the top of your code should look like this:

<?php
/**
 * The main template file.
 *
 * This is the most generic template file in a WordPress theme
 * and one of the two required files for a theme (the other being style.css).
 * It is used to display a page when nothing more specific matches a query.
 * E.g., it puts together the home page when no home.php file exists.
 * Learn more: https://codex.www.ads-software.com/Template_Hierarchy
 *
 * @package Spun
 * @since Spun 1.0
 */

get_header(); ?>

		<div id="primary" class="content-area">
			<div id="content" class="site-content" role="main">
			<?php if ( is_home() && ! is_paged() ) : ?>

				<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
			<?php endif; ?>
			<?php if ( have_posts() ) : ?>
<?php query_posts('post_type=category'); ?>
				<?php /* Start the Loop */ ?>

No go Roel. I think the key here is the CSS.

Whoops, you’ll probably want to take my text out of that code:

<h2>This website is under construcción.</h2><br /><br />

Hey Wouter,

Insert this code in your index.php file:

<?php query_posts('post_type=page'); ?>

It should read like this:

<?php
/**
 * The main template file.
 *
 * This is the most generic template file in a WordPress theme
 * and one of the two required files for a theme (the other being style.css).
 * It is used to display a page when nothing more specific matches a query.
 * E.g., it puts together the home page when no home.php file exists.
 * Learn more: https://codex.www.ads-software.com/Template_Hierarchy
 *
 * @package Spun
 * @since Spun 1.0
 */

get_header(); ?>

		<div id="primary" class="content-area">
			<div id="content" class="site-content" role="main">
			<?php if ( is_home() && ! is_paged() ) : ?>

				<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
			<?php endif; ?>
<h2>This website is under construcción.</h2><br /><br />
			<?php if ( have_posts() ) : ?>
<?php query_posts('post_type=page'); ?>
				<?php /* Start the Loop */ ?>

…

I also noticed that your Research page is named research-index.php. I wonder if that is relevant.

Well done for a first website! I’m impressed.

I think you’re right with the CSS styling. I can see an area for “Homepage” styling in the CSS, and I copied and pasted this and renamed it “Blogpage.” Not sure if this is the right path, and I’m not sure where or how to reference the styling in my php files.

You are being very helpful! Thank you for your time.

Roel, I’m looking at both our sites with Firebug, and I see your Research page calls up CSS styling via Spun but mine does not. Your Research page calls this:

@import "../spun/style.css";
.entry-content, .entry-summary, .entry-title, .entry-title a, .blog .hentry span.hometitle, .hentry.no-thumbnail span, .widget {
    font-family: "Trebuchet MS","Playfair Display","Times New Roman",serif;
}
h1, h2, h3, h4, h5, h6 {
    font-family: "Trebuchet MS","Playfair Display","Times New Roman",serif;
}
.entry-title, .entry-title a {
}
.entry-content {
}
.widget-title {
    font-size: 2rem;
}
#masthead {
    position: fixed;
    top: 40px;
}
#masthead {
    opacity: 0.7;
}
#primary {
    margin: 8em 12em 1.5em;
    padding: 0;
    width: 100%;
}
.page-id-9 #primary {
    margin: 8em 12em 1.5em;
    padding: 0;
    width: 100%;
}
.blog #content {
    width: 40em;
}
.page-id-9 #content {
    width: 40em;
}
.hentry {
    background: none repeat scroll 0 0 #FFFFFF;
    float: left;
    height: 180px;
    margin: 10px;
    padding: 0;
    position: relative;
    table-layout: fixed;
    width: 180px;
}
.blog .hentry a .attachment-post-thumbnail, .archive .hentry a .attachment-post-thumbnail, .search .hentry a .attachment-post-thumbnail {
    opacity: 0.3;
}
.blog .hentry a .attachment-post-thumbnail, .archive .hentry a .attachment-post-thumbnail, .search .hentry a .attachment-post-thumbnail {
    filter: none;
}
.hometitle {
    color: #444444;
    display: table-cell;
    font-size: 2rem;
    font-style: italic;
    text-align: center;
    vertical-align: middle;
    z-index: 1999;
}
.blog .hentry span.hometitle {
    color: #000099;
    padding: 70px 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.blog .hentry span.hometitle:hover {
    color: #FFFFFF;
    text-shadow: 2px 2px 3px #000000;
}
.blog .hentry .page .hentry {
    position: relative;
}
.hentry.no-thumbnail span {
    color: #000099;
    font-size: 1.8rem;
    font-style: italic;
    text-align: center;
}
.hentry.no-thumbnail span:hover {
    background: none repeat scroll 0 0 #444444;
    color: #FFFFFF;
}
.sticky {
}
.single .hentry, .error404 .hentry, .page .hentry, .search-no-results .no-results {
    height: auto;
    margin: 8em 10em 1.5em;
    padding: 0;
    width: 700px;
    z-index: 10;
}
h1 {
    margin: 0.2em 0;
}
h3 {
    margin: 0 0;
}
p {
    font-size: 90%;
}
a {
    color: #000099;
}
a:visited {
    color: #333333;
}
a:visited {
    color: #000099;
}
a:hover, a:focus, a:active {
    color: #999999;
}
.page-links a:hover span.active-link, .page-links span.active-link {
    background: none repeat scroll 0 0 #C1BFB6;
    color: #FFFFFF;
    transition: all 0.4s ease-in-out 0s;
}
.sidebar-link {
    cursor: none;
    display: none;
}
#colophon {
    display: none;
}
.entry-meta {
    visibility: hidden;
}
#secondary {
    clear: both;
    display: block;
    font-size: 1.6rem;
    font-weight: 100;
    padding: 0;
    position: fixed;
    top: 150px;
}
.widget-column {
    width: 200%;
}
.page-id-9 .hentry {
    float: left;
    height: auto;
    margin: 10px;
    padding: 0;
    width: 180px !important;
    z-index: 10;
}
.alignleft {
    display: inline;
    float: left;
    margin-bottom: 0.75em;
    margin-right: 0.75em;
    margin-top: 0.3em;
}

Mine calls only this:

@font-face {
    font-family: "Cutive";
    font-style: normal;
    font-weight: 400;
    src: local("Cutive"), local("Cutive-Regular"), url("https://themes.googleusercontent.com/static/fonts/cutive/v4/GTdET3RjFTKEAlQ1kQzjTuvvDin1pK8aKteLpeZ5c0A.woff") format("woff");
}

I wonder if I need to be somehow “importing” CSS from the main Spun file in my page-blop.php file or the content-blog.php file.

Thanks Roel. Gave that a whirl and no difference yet. Now the top of my code looks like this, just copied and pasted yours:

<?php
/**
* @package Spun
* @since Spun 1.0
*/

/*
Template Name: Blog Template
*/
?>

<?php get_header(); ?>