Cerauno theme – how to show images on front page?

  • Unknown's avatar

    Hi all,

    I’m a complete newbie looking for a clean and simple theme for personal posts, often with one or two images attached.
    I want to set this thing up once and not worry about it again. Perhaps a widget or two (calendar overview) and that’s it, no bells and whistles.

    I’m currently using cerauno but it’s not behaving the way I was hoping. In the view where you select themes it looks as if blog posts are shown in chronological order with headers and images. Yet on my site I can only see the title of my post. The image is only shown when you click on the title.

    It’s billed as a “magazine” theme. I like simplicity but I don’t just want an endless list of titles! How can I get the image to show without having to click on the post? Or is there something fundamental that I’m not getting.

    Thank you!

    The blog I need help with is: (visible only to logged in users)

  • Hi there. To have the image display on the front page you have to select a featured image for the post. In the post editor, look for where it says Featured Image. You can use an image you already added to the post or you can use an entirely different image if you prefer. https://en.support.wordpress.com/featured-images/

    Though, looking at your site it appears you’ve figured this out?

  • Unknown's avatar

    Thank you kokkieh. I hadn’t worked it out, I had simply switched to another theme. I’ll give Cerauno another try with your suggestion.

  • Oops! I didn’t notice that you had Oxygen activated :)

    But the same should apply to Cerauno. The theme’s suggested custom header image size is 1400 x 200 pixels, so I’m guessing using featured images of the same dimensions would work best, but I don’t have experience with this specific theme, so play around with different image sizes. Let us know if you need more help with this.

  • Unknown's avatar

    I was looking for how to fix this myself, so you were very helpful, lol! Thank you!

  • Unknown's avatar

    I’m having image issues with this template as well, if anyone can advise…

    1) The opacity thats being put on the header image is so high, you can’t see the image. Is there a way to let up on that?

    2) The featured image in my post looks great on the home page, but when I go in to that specific post, the image super-sizes. How do I keep it at a reasonable size?

    Thanks!

  • @matthewlevinson

    Both issues you describe are intentional design features of the theme – you’ll see the same behaviour in the theme demo page. I can’t explain why they decided to white out the header image so severely, but in the case of the featured image the image is enlarged to display across the entire width of the reader’s screen. The image height is also adjusted proportionally, so if you’ve used a higher image, as in your second post, it does become supersized. One way to prevent this would be to use only images you’ve cropped in terms of height as featured images. They’ll still resize to the screen width, but won’t take up the entire screen on widescreen monitors.

    The only way to change this behaviour is by editing the theme’s CSS. To change CSS you’ll need the Custom Design upgrade included in the Premium and Business plan.

    See here for instructions how to edit the CSS once you have the upgrade (you can preview CSS changes in the Customizer without an upgrade, but you won’t be able to save them): http://en.support.wordpress.com/custom-design/editing-css/

    To change the opacity of the header image, add the following code in the Customizer:

    .site-branding::before {
    	opacity: 0.4;
    }

    You can set the value next to opacity to any value up to 1.0. The default value for this theme is 0.2.

    For the featured image on single posts, try:

    .featured-header-image img {
        width: 60%;
        float: left;
    }

    The float-left statement lets the image align left over the text of the post. If you prefer the image to be centered, just leave that line out. For the width you can also insert a pixel value (e.g. 700 pixels), but then the image won’t adjust automatically for narrower screens.

    At 60% the image is about the same width as the content area on wider screens, but becomes much smaller on narrow screens, like phones and tablets. You can play around with that value until you find the look you’re happy with.

    There might be a way to have it match the content-column width exactly, but I don’t yet know enough about CSS to tell you how to do that. You can post in the CSS Customization forum for more help with that: https://en.forums.wordpress.com/forum/css-customization#postform

  • @matthewlevinson
    P.S. In future, please remember to include your site’s URL when you post in the forum. I was able to find your site by clicking on your username, but it’s just easier if you give the correct URL in your post itself :)

  • Unknown's avatar

    Hi, I’ve installed cerauno on http://www.caricatur.es. Can’t figure out how to resize featured image so it displays in same dimensions as upload, in post. Any help appreciated.

  • @allancav
    I’m afraid we can’t help you in this forum. http://www.caricatur.es/ is a self-hosted site running the WordPress.org software, which means you also have the WordPress.org version of this theme. In this forum we can only help you with a WordPress.COM site. WordPress.com and WordPress.org are completely separate and different: http://en.support.wordpress.com/com-vs-org/

    Please visit the WordPress.org support forum for assistance: http://wordpress.org/support/ If you don’t already have a username on that forum, click the register button in the upper right corner so you can post in that forum.

    The Cerauno support forum on WordPress.org can be found at this link: https://wordpress.org/support/theme/cerauno

  • Unknown's avatar

    Thanks so much. :)

  • You’re welcome. Hope you find the answer you’re looking for.

  • Unknown's avatar
    thecrazystorklady · Member ·

    Hi there,

    I’m a complete newbie I’m afraid and have been having problems with Cerauno too.

    Thanks to the info on this post (cheers all) I have now got images on the home screen. But, I’m having a few problems with these featured images and was hoping someone might be able to help. First, they are really big (I mean on the screen, not actual file size) – is there any way of shrinking the display size so it’s not so huge? Second, when I upload a featured image only a portion of it is displayed, but I don’t seem to be able to choose which bit. This issue is most obvious on the ice cream image on my page. Is there a way round this?

    My page is: https://breakingupwithcontraception.wordpress.com/

    Thank you so much in advance for the help.

  • @thecrazystorklady

    First, they are really big (I mean on the screen, not actual file size) – is there any way of shrinking the display size so it’s not so huge?

    I assume you’re talking about the single-post view where it stretches the full width of the screen? The only way to override that is via CSS, for which you’ll need the Premium or Business upgrade, as mentioned above.

    The following code should to the trick:

    .featured-header-image {
        float: left;
        width: 50%;
    }

    You can change the width percentage to whatever looks best for you. The float-left property is optional to keep the image positioned above your text. If you leave that out the image will appear in the centre of the screen.

    See here for instructions how to add that code in the Customizer: http://en.support.wordpress.com/custom-design/editing-css/

    Second, when I upload a featured image only a portion of it is displayed, but I don’t seem to be able to choose which bit.

    The theme automatically crops the image you upload for the featured image. The support doc doesn’t specify the dimensions, but I had a look on my test site and it looks like it takes the middle 400 pixels of the image. To have control over this you’ll have to resize and crop your image before you upload it as a featured image. The dimensions appear to be 1400×400 pixels. If your image is smaller, still crop it to the same width-to-height ratio. That should ensure that your entire image displays.

  • Unknown's avatar
    thecrazystorklady · Member ·

    Hi Kokkeih,
    Thank you so much for taking the time to look into this for me (and so quickly!). Really appreciated. Looks like am going to need to get familiar with image editing tools and fast! But at least now I’ll know exactly what I need to be aiming for as an end product, thank you so much.

  • The simplest tool for cropping images is Picasa. You can download it for free if you don’t have it, and it’s great for managing your photos as well.

    It’s not great for exact resizing, though, as you can only resize images according to preset values while exporting them. If you want to precisely resize images http://pixlr.com/ is a simple, free online tool, and while I haven’t used it myself I’ve heard http://www.picmonkey.com/ is also good.

  • Unknown's avatar
    thecrazystorklady · Member ·

    Brilliant – thanks for the tips, really helpful. Btw, I think it’s awesome that people like you exist who are so generous with your time and knowledge to help us newbs.

  • It is absolutely my pleasure :D

  • The topic ‘Cerauno theme – how to show images on front page?’ is closed to new replies.