Introducing Cover for WordPress

Cover is a content-driven blogging theme for WordPress. Built on top of Automattic’s _s (Underscores) and bundled with Font Awesome, Cover allows you to focus on your writing. There are no sidebars to mess with, just a single column view of your content.

Download from WordPress View on Github

Please note that while Cover is still supported, no new features will be added. Active development has moved to Cover2, the next iteration of the theme.


Cover is designed for any size screen. No matter the device, Cover always looks beautiful.

Drawing special attention to featured images, from the homepage to posts, category archives to pages, your blog is made uniquely yours. Of course, you don’t have to use images. Cover’s clean typography lets your writing stand on its own.

Full-width featured images

When you use a featured image in Cover, it displays it as a background image behind the title. Images taller than 600 pixels will be displayed full-screen.

Scalable vector icons

Cover is bundled with Font Awesome v4.3, allowing you to include any of its icons on any post or page.

Built for Aesop Story Engine

Cover was built from the ground up with ASE in mind. Break out of the content area with full-width components like images, galleries, maps, and more.

Put widgets in their place

Cover puts your content first, exactly where it should be. But that doesn’t mean you can’t have widgets and menus, and that’s where the overlay comes in.

The overlay is a full-screen menu and widget display. You can define two menus (a regular one and a social media one) and as many widgets as your little heart desires. You can also put a social menu in the footer.

Social menus

So, about those social menus. All you have to do is create a menu with links to your favorite social media accounts, and Cover will do the rest. It will detect the URL of the site in question and display the appropriate icon, courtesy of Font Awesome.

If you would like to request support for a site’s icon, please raise an issue. Or create a pull request and add it yourself!

Recommended Plugins

Aesop Story Engine

Cover was built from the ground up with Aesop Story Engine in mind. Break out of the content area with full-width components like images, galleries, maps, and more.


Automattic’s Jetpack plugin comes packed with modules for any theme to use, but Cover is designed to work nicely with these:

Site Logo
In the Customizer, you can not only set the site title and tagline, but also a site logo. You can enable and disable any combination of these three options.

Featured Posts
In the Customizer (again), you’ll find the option to assign a specific tag to featured posts (the default is “featured”). Tagging a post will give it a special place on your blog’s home page: it’s displayed larger than the normal post listing, with its featured image displayed prominently behind it. Please note that Cover currently only shows a single featured post, even though you may tag more than one post as featured.

Infinite Scroll
The Infinite Scroll module already works just fine, and we’re not messing with that. But Cover allows you to have a social menu in the footer, so now Jetpack responds accordingly. If you have infinite scrolling enabled and no footer menu, scrolling down will load more posts, just as it’s meant to do. But if you do have a footer menu, you will see a button to click in order to load more posts. (Otherwise, you’d never see the footer!)

Color Posts

Using the Color Posts plugin will allow Cover to match the header’s color to the color of a post’s featured image. Please note that this plugin requires Jetpack.

Built with Sass

If you’re a developer and want to play around with Cover, take a look at the source hosted on Github. The stylesheet used by the theme is not compressed, but it is compiled using Sass. To that end, in the project you’ll find the /sass folder which holds all the components required to compile the stylesheet, including the Bower config required for pulling in Font Awesome. The JavaScript, on the other hand, is compressed, but the uncompressed code is provided in the /js/src directory.)


You can download the latest official release from on your self-hosted site’s theme admin page. Follow these steps to activate Cover:

  1. In your admin panel, go to Appearance > Themes and click the Add New button.
  2. Search for “Cover” and, once you’ve found the theme, click Install.
  3. Click Activate to start using Cover.


You can download the latest from Github. Follow these steps to activate Cover:

  1. Download the latest release.
  2. In your admin panel, go to Appearance > Themes and click the Add New button.
  3. Click Upload and Choose File, then select the theme’s zip file. Click Install Now.
  4. Click Activate.


  1. How do I set the background image behind the post title?
    When you use a featured image in Cover, it displays as a background image behind the title. Images taller than 600 pixels will be displayed full-screen.
  2. Can I change the font size?
    Cover does not allow you to change the default font size. I recommend creating a child theme before making changes to the theme, or use a Google Fonts plugin and then use it to alter H1-6 and Paragraph fonts + size.


If you see something wrong, or you want to improve on what I’ve got here, feel free to submit an issue or create a pull request.


Cover is GPL v2.0 or later.

All other resources are licensed as follows:


    1. If you’re referring to the Jetpack-driven featured content on the homepage, it is currently restricted to a single post. I’ve actually been considering allowing more than one, but I’m unsure how I’d want that content displayed (i.e., in a slider or grid). I’ll probably address it in a future update.

      Both headroom.js and skrollr.js are used in the header, to transition its background from transparent to a solid color. Take a look at the skrollr site for other ways to use it:

    2. Thanks Paul. This theme is awesome and I appreciate your work. VERY MUCH. Also, I’ve been looking at your blog . . . very touching and inspirational. I am planning a WordPress tutorial for YouTube (I’ve done a bunch already but need an updated one) and am thinking of using your amazing theme for my example site. Sending you an email as well.

  1. Hello, I’m using the Cover theme and I would like to change the main blue color that’s used for headers and links on the site. I was hoping this might be an option in the customizer, but is there any other way to easily do this without using a child theme or custom CSS?

    If not, would you consider including this option in a future release?

    1. I wondered when someone would ask about that. :)

      I’m still waiting on the review team at to get back to me on the latest update (it’s still at 1.4 there), but I’ve already pushed out the latest update (1.5) on the Github repo. You can download it here:

      A number of things were added with this version. I was planning on making a blog post about this once the WP review team approved the update, but I’ll list the changes here for you anyway:

      – Added support for Jetpack’s Site Logo module.
      – Added Customizer option to change header color.
      – Added Customizer option to change link color.
      – Added support for the Color Posts plugin to set the header color based on post images. (Please note that Color Posts requires Jetpack to function.)
      – Added TGM Plugin Activation class to suggest Aesop Story Engine.
      – Added caption styles for Aesop Story Engine image gallery types (Grid, Thumbnail, Sequence, Photoset, Parallax).
      – Added styles for Aesop Story Engine to darken the image behind the text in the chapter component, similar to the header.
      – Added background image for sticky posts on archive pages.

    1. My pleasure! I’m curious to know what issue you had with parallax. Are you talking about the parallax in the post/page featured image, or with the Aesop Story Engine parallax gallery component?

    2. The post images. They showed and looked nice, but scrolled with the page (unlike your site, and mine post-upgrade). I’d gone through and looked for a plugin conflict, cleared the site cache, and tried different image sizes. Nothing worked, but the upgrade has overwritten whatever was misbehaving. I’ll be finishing the site and will start adding fresh content by weekend:

  2. When I use a featured post, which shows up in the home page header, there’s no Read More link, and instead it ends with […]. I would like to add the Read More link back in as a button below the excerpt, and possibly even customize the color of that button using the Customizer to something other than the regular link/header colors.

    Would this be easy enough for me to do in a child theme, or would you consider it for a future update? As far as a child theme goes, it looks like inc/cover-featured.php has that No More Link message; I’m just not quite sure what to do there to bring the link back in.

    I could even just CSS it down to the next line with a custom color if needed, but having the Read More link is the main priority (and customizing it as a button, etc. isn’t as crucial).


    1. You’d want to put a Read More link back in with a child theme. I prefer not to have one myself, that’s why it’s missing. You could also easily set the featured post’s Read More link color in the CSS of the child theme. If you created a child theme, you’d copy inc/cover-featured.php and make your modifications there.

  3. Hi Paul, just playing with this theme now. Am I correct in seeing just a single level menu on the overlay? Or is there some way to activate a menu hierarchy?

    Hi again Paul, sorry, I’m an idiot. I see how it works now. face slap for me.

  4. Hi Paul, love the Cover theme; thanks.
    One question: it’s great to see that the tagline is now visible on mobile devices, but it wraps in portrait layout on phones. Is there a way for the tagline to appear under the site title in portrait, and in-line in landscape?

    1. Thanks Paul. Maybe there’s a ‘nicer’ way to make everything fit, but I’m not known for my design skills. Good-luck. :)

  5. Hi again Paul,
    Thanks so much for an awesome, clean theme.
    I was wondering – is there any way to implement a category hierarchy, much the same way that menus work? If not no worries, I can implement in the overlay menu structure – but it would be nice to use WP’s inbuilt category widget rather than the menu.

    Thank you!

  6. Hi Paul, love the theme. I have tried using SiteOrigin’s Page Builder plugin but it doesn’t integrate too well, interfering with layouts. Is this something you have come across?

    1. No worries, thought it might make life easier but its ended up being more of a hassle anyway.
      Under Menu Settings, Theme Locations there are three options, how do the two Social Menus work? I cant seem to work out how to configure them.

    2. So, you’ll want to create a menu just for use in one of the two social menu locations (in the overlay or the footer). When you create a menu item for it, make it a custom link that points to one of your social media accounts. (For example, is mine for Twitter.) Cover will inspect the URL and assign the appropriate icon.

  7. Hi, I am liking the theme so far, but for a reason the quote component doesn’t work well. The pull quote is invisible and the full-width quote is off. I haven’t used any other components aside of chapter and image so I can’t really tell what else is wrong when I use it.

    Edit: It is apparently only happening when parallax is turned on. When turned off, the quote is shown but with white background, no matter what color was chosen

    1. Thanks for the feedback. I am aware that the quote component has had issues since ASE introduced two variations, “full width” and “pull quote.” I will be addressing this in the next version of Cover.

    2. Thank you! I did not expect such a prompt reply.
      I am wondering what might be wrong with my installation too, since the problem with parallax and floater extends to all other components. Even without such effects, Cover is already a joy to read in though!

    3. There is an issue with parallax-enabled components not displaying which has been fixed, but the issue in the screenshot above is actually an Aesop plugin issue. The pull quote doesn’t use the background color property, so when the text color is white, it doesn’t show up. I don’t feel comfortable overriding the text color property, since that’s under the author’s control. Just make sure you don’t use white for the text color, and it’ll be fine.

  8. Pingback: Comments Policy
  9. Hi Paul
    I would like ask You how I can made menu (primary) with drop down submenu? Must I have Jetpack? Now I play with theme in lamp (Linux), offline. I can’t find method…

    1. Thx for Your Answer. But here it not working. I try on the target server for a few days.
      Best, theme is very original work.

    2. Hi Paul

      I still can’t make submenu with dropdown… My site:
      I would like insert a few pages under Interactive item with toggle and dropdown
      because it not most importend items, I don’t want long menu with it…
      Can You see and help maybe, please ??


  10. Hi,

    Just installed this theme, and I love it.

    I really want to use ‘sub title’ to show on homepage as excerpt, or to show it in single article page just under the main title.
    Really appreciate it if you consider to add that feature in the next update :)

    Great theme.

    1. Are you using plugin to make subtitles? I didn’t think WordPress supported them natively.

      I’m glad you like the theme!

    1. With a little configuration, it doesn’t look so bad. In order to match Cover’s fonts and spacing, I set Crayon to use the following:

      – Font family: Source Code Pro
      – Font size: 15 pixels
      – Line height: 28 pixels
      – Max width: 760 pixels
      – Top margin: 20 pixels
      – Bottom margin: 20 pixels

      I picked the Kayote theme, since it pretty closely matched the dark background color Cover uses for code blocks.

      Let me know if you’re still having trouble getting it to look nice.

  11. Your website caught my attention. Thank you, Paul Eiche. Thank you for the theme too. It’s an elegant and smart theme. Best, M Vig

  12. Hi Paul, do you have any idea how to delete the author name and avatar under the title of post in the homepage? I am sorry for this “amateur” question, since I am new working with wordpress. Thank you!

    1. Don’t be sorry at all! We all have to start somewhere.

      Are you talking about removing the author’s avatar and name from the post listing? (See screenshot.) I recommend making a child theme and copying the file /template-parts/content-summary.php to make the changes you require.

      If you want to completely remove the post meta (this includes the timestamp, as well as author info), then you can remove on line 33. If you want to change the meta output, you’ll have to make a copy of /inc/template-tags.php and modify the cover_posted_on() function.

      If all this is sounding too complicated, email me at and we can discuss further.

  13. Cover is just amazing! I’ve been looking for a theme like this for quite a few days. I will be using it for a new blog project right away. The fact that you are actually using it on your personal website gives me lots of trust. Thanks, this theme is really a sort of lifesaver for me.

    1. Thanks for the kind words! Cover has been a labor of love since the beginning, since I wrote it first for myself. I’m glad to see it has another fan. :)

    1. Add this to your stylesheet:

      .entry-content .aesop-component:first-of-type {
      margin-top: -40px;

      I would normally use :first-child, but Aesop adds a element above the .aesop-component element, so that won’t work. The :first-of-type will ensure that it doesn’t set the negative margin on every element.

    1. That’s not really feasible with CSS in a variable-width font. (You can, making some assumptions, fake it with a fixed-width font.) You can achieve it with JavaScript, but I wouldn’t recommend it.

    2. Would you mind telling me how I could go about faking it with a fixed-width font? I totally understand if it’s too much trouble to describe and/or you don’t have time, and thanks again for your quick response.

    1. Thanks for the kind words.

      In order to prevent random CSS breakages, I wrote completely custom ASE styles. One of the components I never used was the collection block, so it remains relatively unstyled. Unfortunately, I am not adding any new features to Cover anymore since I published its rewrite, Cover2.

    2. Thanks for your answer. I have just installed Cover 2 and I can see that the CSS issue with Aesop collection is well fixed. Now it looks great. However, I have a few new issues. 1) Now in all pages there is a margin on top of the cover image that was not there with the previous version of Cover); 2) There is no more clickable arrow at the bottom of the cover image (it was a nice feature in the previous version of Cover). Do you plan to do something about those issues?

    3. The margin you’re seeing a result of including the Bootstrap stylesheet, which is included in the Magee Shortcodes plugin. To fix it, add this style to your stylesheet:
      .page-header { margin-top: 0; }

      I’ve actually been considering putting the clickable arrow back in. That should be included in the next update.

    4. I added the CSS line you suggested. But unfortunately, the margin is still there. Maybe I should just deactivate Magee.
      By the way, I cannot see the option to activate the featured content slider on pages

    5. You might have to put !important on that line of css.

      The featured content is a Jetpack module. If you don’t have Jetpack installed, it won’t be available.

    6. OK. I have already installed Jetpack. I will try out the slider module. Unfortunately, adding !important in the CSS line does not remove the top margin. Anyway, now I have an even bigger problem. The links in the aesop components no longer work for some reasons. Here you are my page:

    7. Hi, any idea about a potential conflict between Aesop and Cover 2?
      I tried many things, but I cannot get the links working…

    8. Hi, while waiting your next release fixing the link issue related to Aesop reveal effect and the page top white gap issue related to Magee plugin (unfixed by CSS), I would like to ask your help for another two things:
      1) in Aesop page collection each featured image preview has the following text “Written by …” . This should not be there since WP pages do not show authors details. How can I remove it?
      Here you are the link to my page collection:
      2) Is there a way to remove the featured image box in specific pages? For example, I would like to get rid of the whole blue box here:

    9. Stefano,

      The most recent update (published on July 6) fixed the reveal effect bug.

      The “Written by” text is inserted by the Aesop Story Engine plugin, but I agree that it should not be shown on pages (as opposed to posts). I’ll see what I can do to fix that.

      The colored header is part of Cover2’s design. There is currently no way to get rid of it. Do you know how to create a child theme? That would allow you to customize the appearance to your liking.

    10. I updated to the newest version of Cover 2 and I noticed that the link issue is solved indeed. Thanks a lot. As for the child theme, I have never created one. I checked instructions on WP website. If you tell me the code I need to paste in the style.css and the functions.php of my theme-child directory, then I’ll try to do my best.

    11. Actually I solved the issue in a easier way. It is enough to chose ‘no header” in the page attributes and the featured image box disappears. Look here:
      However, now I have a different issue: I installed jetpack, added the “featured” tag in the Featured content section of Customozation, but the sliders does not show up in the homepage

    12. That’s because you seem to have a page set up as your homepage, not a post listing. The slider is only enable for the list of posts as the homepage.

    13. Thanks. Now it works. Now I am adding widgets and I noticed that there is only the Overlay widget area, but no Search and Footer widget areas that instead existed in the previois version of Cover. Do I need to set up something to see them?

    14. Pity Particularly, the footer widgets area is always something useful. I’ll try to add some footer plugin then.

    15. The culprit is the Bootstrap stylesheet again. It sets the font-size to 10px on the html element, which alters Cover2’s font size of 1.25rem.

    16. Sorry, I did not understand. What do you mean by Bootstrap stylesheet? I did not touch the theme CSS. And I did not use any such thig as Bootstrap

    17. I deactivated the plugin and now the fonts seems to have gone back the default Cover size. But, as you can se,,there is still a different in size between the text before and after the sentence “An embarrassing ally named Mubarak”

    18. The first paragraph in any post or page has a font size of 125%. That’s a design decision I made when building Cover and Cover2.

    19. Yes, I know. And I like that. But as you can see, in the pot I share with you not only the first paragraph, but all paragraphs up to the sentence “An embarrassing ally named Mubarak” have a font size of 125%.

    20. Hi again. I solved the issue with the font size. But now I have an issue with background color. I set it to black, but it is black only on Firefox, not on Chrome and Explorer. Please see here:
      Also, is there any chance that you put your nice Footer area back in your theme?

    21. The CSS selector that assigns the black background color is:


      The “.browser-gecko.os” selector targets Firefox. (“Gecko” is the name of Firefox’s rendering engine.) If you want only that page to have a black background color, I recommend changing the selector to this:


    22. Thanks a lot. It works. So you do not plan to restore the footer area in your theme? Or is there any way to put it back through adding some lines of code?

    23. Do you mean the social media icon menu in the footer? Or are you talking about putting widgets in the footer?

      I have no plans to do either, but I’ll think about it.

    24. I removed a lot of things in Cover2; that’s a big part of why I launched a brand new theme, instead of pushing it as a new version of Cover. I removed the grid view for post listings, featured images from post listings, background color, social media menu from the footer, and widget areas from the footer and search overlay. If you still want any of that, I encourage you to keep using Cover. I still maintain it (i.e., fix bugs) but it won’t be getting new features.

    25. I understand. However, I would like to know if is there any line of code that I could use to add the footer area to Cover2

    26. I was wandering if you could check my latest issue. Actually, the issue subsists only when you hold a mobile device in horizontal position. In vertical, the layout looks fine

Leave a Reply

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