skip to Main Content

I have been using different plugins to style my website (Elementor for example). I want to add a blog but I dont like the default template it haves and if want
it to look like I want I have to style each post separately.

I think that uploading a custom theme may be the answer but I dont want to make a template for all the website elements just one for the blog posts.

Any lead on where to start? I know php, css, html and javascript but I am a rookie to wordpress, I already have access to all the files via ftp.

4

Answers


  1. Basically it’s enough to create a file named single-post.php as a template file (you could derive it from single.php which is in your theme folder) and put it into your theme folder. It will be used automatically to display all single posts.

    However, be aware that as soon as you update your theme (which usually happens quite often), this file will be lost since the complete theme folder will be overwritten. So either you keep a copy and adapt that after each update (if necessary) and copy it to the new theme folder again, or you create a child theme: You don’t need to create all theme files again for that, only the ones you want to overwrite.

    Details about child themes can be found here: https://codex.wordpress.org/Child_Themes

    Login or Signup to reply.
  2. I think a good place to start would be here https://codex.wordpress.org/Theme_Development
    Theme Development WordPress Codex.

    It’s going to be a whole lot cooler if this is a fresh install and your just wanting some extra features for yourself. Because it will take less work, since you will probably want to create a child theme. Explained further in theme development. But when it comes to making your own template for pages, example, you like them all but the blog roll.

    At the top of you page where you build out your page should have this.

    <?php  
          /*Template Name: My New Blog Roll*/  
            get_header();
     ?>
    

    Or whatever you like.

    Then you can set it up on wordpress in the admin section of pages where it says “Template Pages” inside one of the pages. Choose “My New Blog Roll” because now it would be an option for you.

    More on that here. https://developer.wordpress.org/themes/template-files-section/page-template-files/

    Here is an example of one I was messing with the other day with bootstrap. Notice the PHP and take out what you need.

        <?php 
        /*
            Template Name: Blog-Temp
        */
        get_header(); 
    ?>    
    
        <header class="blog"> 
             <nav class="nav navbar">
                    <div class="container-fluid">
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navMenu" aria-expanded="false">
                                <span class="sr-only">Toggle Navigation</span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>
                            <h1 id="brand"><a href="<?php echo home_url('/'); ?>"><?php if(get_bloginfo('name')){ bloginfo('name');}else{echo 'Brand Name';} ?></a></h1>
                        </div>
                        <div class="collapse navbar-collapse" id="navMenu">
    
                            <?php 
                                wp_nav_menu(array(
                                    'menu'                  =>  'primary',
                                    'theme_location'        =>  'primary', 
                                    'menu_class'            =>  'nav navbar-nav',
                                    'menu_id'               =>  '',
                                    'container'             =>  'ul',
                                    'depth'                 =>  1                                
                                ));
                            ?>
    
                        </div>
                    </div>
                </nav>
            <section>
                <div class="ui-page-header">
                    <h2>Blog</h2>
                </div>
            </section>
        </header>  
          <div class="clearfix"></div> 
    
    <!--
    ===========================================================================
        Main Blog Section
    ===========================================================================
    -->
    <section class="container-fluid ui-content">      
        <div class="row">
    <!--        
        Could be for later content like categories floated left like a sub menu
    -->
        </div>
        <div class="row">
            <div class="main col-md-8">
                <?php if(have_posts()) : ?>
                    <?php while( have_posts() ) : the_post(); ?>
                        <article class="row post">
                            <?php if(has_post_thumbnail()) : ?>
                            <div class="col-sm-5 post-thumbnail">
                                <?php the_post_thumbnail(); ?>
                            </div>
                            <div class="col-sm-7">
                                <h3 class="post-title"><a href="<?php echo the_permalink(); ?>"><?php the_title(); ?></a></h3>
                                 <?php get_template_part('template/post-meta'); ?>
                                <p class="post-content"><?php the_excerpt(); ?></p>
                                <p class="text-right"><a class="btn btn-primary" href="<?php echo the_permalink(); ?>">Read More</a></p>
                            </div>
                            <?php else : ?>
                                <div class="col-sm-12">
                                    <h3 class="post-title"><a href="<?php echo the_permalink(); ?>"><?php the_title(); ?></a></h3>
                                    <?php get_template_part('template/post-meta'); ?>
                                    <p class="post-content"><?php the_excerpt(); ?></p>
                                    <p class="text-right"><a class="btn btn-primary" href="<?php echo the_permalink(); ?>">Read More</a></p>
                                </div>
                            <?php endif; ?>
                        </article>
                    <?php endwhile; ?>
                    <?php wp_reset_postdata(); ?>
                    <?php else : ?>
                    <p><?php esc_html_e( 'Sorry, no posts matched your criteria.' ); ?></p>
                <?php endif; ?>
            </div>
            <div class="sidebar col-md-4">
                <?php if(is_active_sidebar('sidebar')) : ?>
                <?php dynamic_sidebar('sidebar'); ?>
                <?php endif; ?>
            </div>
        </div>
    </section>
    <div class="clearfix"></div>
    
    <?php get_footer(); ?>
    

    Also when looking up anything on the inner webs search for “my problem is this” and put wordpress at the end. Example: “how to get the categories wordpress”

    Hope this helps.

    Login or Signup to reply.
  3. For making a different design post page go into the single.php file where we can edit that page and customize .
    and another option is that we can create the custom post in our theme and then add the new file in theme ,name should be like this of that new file

    single-{custom post type name}.php or single-services.php

    for example “services” is our custom post type .
    in this pages we can put our template design as single page we want to show on our site and this single page will only show our custom post single post.

    Login or Signup to reply.
  4. You can use Elementor in you Post, create a layout or modify an existing layout as you like.
    You can then save that "template", so that you can reload its layout for future use.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search