• Home /
  • Services /
    • Blogger Design Services
      • Premade Blog Templates
      • Custom Blogger Designs
    • WordPress Design Services
      • Premade WordPress Themes
      • Custom WordPress Blog Designs
    • Website Design
    • Blogging Resources
    • Logo Design
  • Blogger Templates/
    • View All Premade Blogger Templates
    • Custom Blogger Designs
    • Shop by Price
      • $40.00 Blogger Templates
      • $15.00-$30.00 Blogger Templates
      • $10 Blogger Templates
    • How It Works
    • FAQ / Template Help
    • Premade Blogger Templates – TOU
  • WordPress Themes/
    • Start Here
    • Shop Themes
    • Custom WordPress Designs
    • Theme Install FAQ’s – Troubleshooting
    • WordPress Themes – TOU
    • Log-In/ Register
  • Portfolio
    • View All Custom Blog/Web Designs
  • Blog /
  • Blogging Resources /
  • Cart

BD Web Studio

Feminine Blogger Templates, Feminine WordPress Themes for Women, Custom Blog Design and Small Web Design

How To Show Post Excerpts on Blogger

August 11, 2017 by Emily M 1 Comment

How to Show Post Excerpts (Read More Links) on BloggerIf you are looking to show short post summaries with a “Read More” link on Blogger posts as opposed to full posts on your Blogger homepage than this tutorial will show you how to do just that! Post excerpts display as partial posts with a “read more” link connecting to the full post. Some bloggers don’t like the idea of having their entire post displayed on the homepage, especially if you write longer posts so the using post excerpts is a great way to shorten things up. Having post excerpts as opposed to full posts gives your blog a very clean and organized look and also makes it easier to display your content in a manner that is eye catching to your readers. Additionally, the shorter post previews allow you to show more posts on your homepage which gives your readers more options to engage with your site.

There are a few ways to show post excerpts on Blogger. While there is a way to add post excerpts automatically, this tutorial will show you how to add them manually. There are advantages to both ways but I like adding them manually better for multiple reasons:

  1. I get to decide exactly where the content ends
  2. I don’t have to worry about glitches with the coding for the automatic version
  3. Adding them manually is nothing more than one click – so easy!

If you do want to add style to the “read more” you will need to add some code to your template otherwise it will be just text. See bottom of post if this is something you want to do.

adding post excerpts and the “Read More” link is a very simple and easy little trick so for those of you seeing it for the first time get ready to be amazed at how truly easy it is to add!

how-to-add-post-exceprts-blogger

how-to-add-post-previews-blogger-post-excerpts-part-2

Easy, right?

And now that you know how to create post excerpts you can easily add the page breaks for your excerpts while you are writing your posts!

If you are happy with the “read more” design then you are all set. If you would like alter the design and are willing to get into the code of your template read below to find out how to to style the “read more” under your post excerpts on Blogger.

We now have premade Blogger templates with built in customization of the “read more” link on post excepts – you can check the Blogger templates here!

PLEASE NOTE: IF YOU PURCHASED A DESIGN FROM US THAT INCLUDED CUSTOMIZED POST EXCERPTS YOU DO NOT NEED TO ADD ANY CODE UNLESS YOU WANT TO CHANGE THE LOOK.

The code below will give you a small grey box with white font with hover effect but feel free to change to match your blog.

{Be sure to backup your template before altering any code of your blog template}

1. Go to your template page and click on

2. Look for

[code]]]></b:skin>[/code]

Take the code below and paste it ABOVE that

.jump-link a{
color:#ffffff;

}

.jump-link{
text-align:center!important;
margin:0px auto;
width:150px;
background:#969696;
border:1px solid #000;
letter-spacing:2px;
padding:11px 0;
display:block;
text-transform:uppercase;
text-decoration:none!important;
font:10px arial,sans-serif;
position:relative;
top:10px;
transition:background-color.25s ease-out;
-o-transition:background-color .25s ease-out;
-moz-transition:background-color .25s ease-out;
-webkit-transition:background-color .25s ease-out
}

.jump-link:hover{
background:#cccccc;
}

.jump-link:hover a{
color:#000000!important
}

Be sure to save your edits.After you get that code added your “Read More” links should now have a bit of style. I would love to see if you get post excerpts added to your site be sure to leave a comment so I can check out your blog!

Blog Templates for Teachers – New Designs
How To Add “Shop The Post” To Your Blog

Comments

  1. andy says

    December 12, 2017 at 3:34 pm

    this was very helpful. thank you!

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Custom Blog Design Blogger and WordpressPremade Blogger Templates - Wordpress ThemesLogo Design - Business BrandingBlog Tutorials

Looking for something specific?

Shop Our Templates

Stay Updated!

Subscribe via email and receive 15% and template or theme in our shop!

Latest on Instagram!

Follow on Instagram

Looking for something?

Latest Pins!

Show your support wiHandwritten Font BunThinking about start
Pinterest

Digital Blog Resources

 
Web Hosting

Spread the Word!



Visit Blogaholic Social Network
Follow on Google+

What Others Are Saying:

Happy With Outcome

I am new to the blogging world. I found blogaholicdesigns and did not hesitate in deciding to contact Emily. She was very patient, punctual and friendly. Her language was very user-friendly. I recommend to anyone who is just starting out, or anyon...

Giselle Paniagua
Above and Beyond Customer Support

Emily is amazing. She answered questions for me about how to best get what I need using her templates before I even paid for anything. Once I bought a template, she went way beyond what I expected from purchasing a non-custom template. Seriously, ...

Emily Leachman
The Darling Dogwood
Creating curriculum for teachers and parents.

I hit up Emily with a design I had in mind for my Blogger site. She was able to execute my design and make it all work with my Blogger site seamlessly and speedily.

My site has been taken to a new level of professionalism and quality thanks...

Christina Morrison
Glimmercat Education
Wedding and Eventagency based in Austria, Europe

It was wonderful to working with Blogaholic Designs!!
I do love my new sites very much!!
Thank you so so much for realizing all my wishes and for being so quick and very competent in your work!!!

I am looking forward to our next...

Daniela Kainz
Daniela Kainz Weddings and Events with heart
Couldn't Be Happier!!

Emily is Awesome!! She is so easy to work with, every step of the way!! My site gets SO many compliments on the New Design. It is all I could have wanted and more.

Quick, Friendly and Extremely Talented!

I have already recommended...

Lisa Filipe
Tasty Book Tours

Read More Testimonials »

  • Contact Us /
  • Community /
  • About /
  • Design Terms/
  • Privacy Policy
Important: We have updated important matters regarding our site in relation to how your information pertains when using our site and what cookies are collected. By using our site you consent to our updated policies. Please review and accept our our updated Privacy Policy

Copyright © 2019 · Theme Design by BD Web Studio · Powered by Genesis