Wordpress Web Development

How to Customize Blog Layout In WordPress?

Rushik Shah User Icon By: Rushik Shah

WordPress is a very versatile open source software. It can be downloaded and installed by just about anyone. That is the easy part as is setting up the website yourself. It is even possible to install a new template by simply purchasing it online if you are one of the people that like ready made templates.

When it comes to customizations the going gets tough. In spite of that this article describes how to make changes to the blog layout; by letting you know which portion of the code you need to modify.

But sometimes this is not enough and your requirements are pretty high that you require detailed customization. In that case it would be safe to say that you require a professional WordPress web developer.

You can customize blog layout in WordPress by instructions mentioned here. To start with the default blog layout which is generally used as the homepage and category archive has the following list of sections:

  • Post title
  • Post details
  • Post excerpt

You will have to login to your web server via FTP in order to modify this file. Once logged in, navigate to your theme directory and look for the index.php file. This file can be different for different templates.

For example in several templates this file is named home.php or default.php as well. As per the new sample template in WordPress 3.8.2 our will notice that the loop for the posts in present in the index.php file however the format for the layout of blog is present in a file by the name content.php. This too can be download from the same directory (your theme directory).

The code present in this file as placed below can be modified to change the layout of the blog.

<article id=”post-<?php the_ID(); ?>” <?php post_class(); ?>>
<?php twentyfourteen_post_thumbnail(); ?>
<header class=”entry-header”>
<?php if ( in_array( ‘category’, get_object_taxonomies( get_post_type() ) ) && twentyfourteen_categorized_blog() ) : ?>
<div class=”entry-meta”>
<span class=”cat-links”><?php echo get_the_category_list( _x( ‘, ‘, ‘Used between list items, there is a space after the comma.’, ‘twentyfourteen’ ) ); ?></span>
</div>
<?php
endif;
if ( is_single() ) :
the_title( ‘<h1 class=”entry-title”>’, ‘</h1>’ );
else :
the_title( ‘<h1 class=”entry-title”><a href=”‘ . esc_url( get_permalink() ) . ‘” rel=”bookmark”>’, ‘</a></h1>’ );
endif;
?>
<div class=”entry-meta”>
<?php
if ( ‘post’ == get_post_type() )
twentyfourteen_posted_on();
if ( ! post_password_required() && ( comments_open() || get_comments_number() ) ) :
?>
<span class=”comments-link”><?php comments_popup_link( __( ‘Leave a comment’, ‘twentyfourteen’ ), __( ‘1 Comment’, ‘twentyfourteen’ ), __( ‘% Comments’, ‘twentyfourteen’ ) ); ?></span>
<?php
endif;
edit_post_link( __( ‘Edit’, ‘twentyfourteen’ ), ‘<span class=”edit-link”>’, ‘</span>’ );
?>
</div><!– .entry-meta –>
</header><!– .entry-header –>
<?php if ( is_search() ) : ?>
<div class=”entry-summary”>
<?php the_excerpt(); ?>
</div><!– .entry-summary –>
<?php else : ?>
<div class=”entry-content”>
<?php
the_content( __( ‘Continue reading <span class=”meta-nav”>&rarr;</span>’, ‘twentyfourteen’ ) );
wp_link_pages( array(
‘before’ => ‘<div class=”page-links”><span class=”page-links-title”>’ . __( ‘Pages:’, ‘twentyfourteen’ ) . ‘</span>’,
‘after’ => ‘</div>’,
‘link_before’ => ‘<span>’,
‘link_after’ => ‘</span>’,
) );
?>
</div><!– .entry-content –>
<?php endif; ?>
<?php the_tags( ‘<footer class=”entry-meta”><span class=”tag-links”>’, ”, ‘</span></footer>’ ); ?>
</article><!– #post-## –>

In the above code the code displaying the post title is as below:

<?php
endif;
if ( is_single() ) :
the_title( ‘<h1 class=”entry-title”>’, ‘</h1>’ );
else :
the_title( ‘<h1 class=”entry-title”><a href=”‘ . esc_url( get_permalink() ) . ‘” rel=”bookmark”>’, ‘</a></h1>’ );
endif;
?>

The code that shows the pot creating date is as below:

if ( ‘post’ == get_post_type() )
twentyfourteen_posted_on();

The following code displays the excerpt or content of the post:

<?php if ( is_search() ) : ?>
<div class=”entry-summary”>
<?php the_excerpt(); ?>
</div><!– .entry-summary –>
<?php else : ?>
<div class=”entry-content”>
<?php
the_content( __( ‘Continue reading <span class=”meta-nav”>&rarr;</span>’, ‘twentyfourteen’ ) );
wp_link_pages( array(
‘before’ => ‘<div class=”page-links”><span class=”page-links-title”>’ . __( ‘Pages:’, ‘twentyfourteen’ ) . ‘</span>’,
‘after’ => ‘</div>’,
‘link_before’ => ‘<span>’,
‘link_after’ => ‘</span>’,
) );
?>
</div><!– .entry-content –>

Alakmalak is one such company that is involved in WordPress Web Development and can be off assistance.

Why Choose Alakmalak As a Your Growth Partner?

Prepare Your WordPress Websites

Alakmalak is a Web Development Company In India that offers services for several technologies. There have been around for a very long time and have developed over 2500 projects for clients all around the world. They have highly skilled web developers with a great deal of experience.

  • How to change Wordpress blog Template
  • How to customize blog layout in WordPress?

What’s Next ?

I know after reading such an interesting article you will be waiting for more. Here are the best opportunities waiting for you.

Share via
Copy link
Powered by Social Snap