WordPress.org

Ready to get started?Download WordPress

Forums

Show only feature image on the front page. (24 posts)

  1. lewissn
    Member
    Posted 1 year ago #

    I'm relatively new to WordPress so i'm still trying to get to grips with it all.

    On my front page it shows all the content from the posts i make, but i'd like to change it so it shows only the featured image which links to the rest on the post. I'm using a theme called iRibbon if that helps.

    Any feedback on this issue would be greatly appreciated.

    Thanks

  2. Arley McBlain
    Member
    Posted 1 year ago #

    Hard to be super specific without seeing what you mean, but a couple thoughts come to mind.

    - Settings > Reading can change your front page to be "excerpts" instead of the full post (if that's what you mean by all the content)

    - your theme's front page may be generated by your themes frontpage.php, home.php or possibly index.php. If you're comfortable with some code tinkering (consider using a WordPress Child Them first) you can do anything you want! I'd tackle this in one of two ways:

    - If your theme doesn't have a frontpage.php, you can make one and copy the code from the file it is using (WordPress has a default hierarchy it uses: http://codex.wordpress.org/Template_Hierarchy) and make the changes you want (like getting rid of the call to the_content or the_excerpt

    - If you don't want to create a new file you can use the Is Front Page conditional wrapper to call a different loop: http://codex.wordpress.org/Function_Reference/is_front_page

    I hope this gets you off to a start.

  3. lewissn
    Member
    Posted 1 year ago #

    Thanks Arley, i'll have to look further into writing my own code for frontpage.php since i don't have one.

    Basically, the post has a few pictures, but the problem is all the pictures in the post are displayed on the front page as well. I only want the first, or featured picture to be displayed on the front page. The only example i can think of is http://www.thechive.com.

    Would there be a quick fix to this? Or would i need to spend ages writing a php file to make this happen.

    Thanks

  4. Arley McBlain
    Member
    Posted 1 year ago #

    Look into that Settings > Reading thing. I'm pretty sure the_excerpt won't show images.

    I think The Chive is using a custom template there to show the title, the featured image thumbail and possibly the excerpt. Give that a shot. Showing the Full Feed isn't a great solution if you want page views.

  5. lewissn
    Member
    Posted 1 year ago #

    The only thing i could get to kind of work is by putting <!--more> after the first image, and linking the image to the post. Just seems like there should be an easier option to automatically do that on every post.

    Any ideas?

    And from what i've gathered, iRibbon theme is very uncooperative and doest like change.

  6. Arley McBlain
    Member
    Posted 1 year ago #

    ...When you say "first image" is that inside the_content() (Ie, when you write the post is the image inserted in the content are), OR are you using Featured Images?

    Featured images are added usually in the right sidebar of the post creation section. You can read more about them here! http://codex.wordpress.org/Post_Thumbnails - These are def what The Chive are using.

  7. lewissn
    Member
    Posted 1 year ago #

    Preferably i'd like to use featured images. But i'm open to use anything that would work.

    When i add a featured image, on the front page it just shows a small thumbnail above the rest of the post. So i'd like to just show the featured image by itself, and maybe make it bigger since it's quite small for some reason, and editing it's dimensions in the function.php file doesn't seem to have any affect at all.

    Sorry if i'm not very clear, i'm still trying to get used to all of this.

  8. Arley McBlain
    Member
    Posted 1 year ago #

    I think you need to add a new featured image size. Check out the link above for a line like this (goes in functions.php):

    add_image_size( 'frontpage-thumb', 300, 400 ); //300 x400px image

    Then where the frontpage loop is happening you'll add

    <?php the_post_thumbnail( 'frontpage-thumb' ); ?>

    You can actually slap a div with a class around that PHP then style away as needed as well.

  9. lewissn
    Member
    Posted 1 year ago #

    Okay so i've tried everything and maybe(probably) there's something i'm doing wrong but everything i edit in the template files or function.php doesn't make any visual difference to my website.

    This is where i'm assuming my front page loop is, could you take a quick look and see if i'm doing something wrong, missing out something or anything.
    http://pastebin.com/T6p6Qd3Z

    Thanks, for the help so far by the way. I hate being the noob that doesn't understand anything.

  10. Arley McBlain
    Member
    Posted 1 year ago #

    I don't think it would be in archive.php. More likely in index.php. Have you modified stuff in this archive.php page?

    If your site isn't live to the public you can find out the old fashioned trial-and-error page which template is being used: hardcode a paragraph with a made-up word! <p>Testerooo?</p> for instance. Once uploaded go to your front page and look for that wackiness. If it's not there, that's not your template (or at least not that view). Be sure to remove this craziness after testing :D

    We have all been n00bs! No worries man, this is what the forum is for.

  11. mehrshadk
    Member
    Posted 1 year ago #

    Hi. I'm also looking for a way to show my posts by their images only, which further information would be available by clicking on them.
    Would you do me a favour about this issue, please?

    Regards

  12. Arley McBlain
    Member
    Posted 1 year ago #

    Sure! You'll need some "if has thumbnail" logic like from here: http://codex.wordpress.org/Function_Reference/has_post_thumbnail

    // Must be inside a loop.
    
    if ( has_post_thumbnail() ) {
    	the_post_thumbnail();
    }
    else {
    	echo '<img src="' . get_bloginfo( 'stylesheet_directory' ) . '/images/thumbnail-default.jpg" />';
    }

    This will get the thumbnail, and have a fallback. Be sure to have your permalink wrapper around the image.

    If you create a new thumbnail size as I mentioned above you may need a plugin like Regenerate Thumbnails to redraw them at the new size!

  13. mehrshadk
    Member
    Posted 1 year ago #

    Dear Arley

    Thank you for reply. As I use child-theme functions.php,
    How can I put the commands inside a loop in child-theme functions.php?

    Regards

  14. Arley McBlain
    Member
    Posted 1 year ago #

    That's a couple questions in one!

    For one thing a child theme's functions.php will be used in addition to the parent theme's functions.php

    Secondly, the loop won't be in functions.php. If Your current loop is in the parent theme's content.php you can just save that file into the child theme, and modify it there.

    Does that help?

  15. mehrshadk
    Member
    Posted 1 year ago #

    Dear Arley

    This is a great help.

    Thank you very much

  16. mehrshadk
    Member
    Posted 1 year ago #

    I visited http://codex.wordpress.org/Function_Reference/has_post_thumbnail
    and the script you mentioned earlier was not recommended so according to WordPress guide I pasted the one below it into the body of my
    post-thumbnail-template.php file in the child-theme directory. But it showed no change to the appearance of contents and title which I wanted them hidden. I appreciate any further suggestion.

  17. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    pasted the one below it into the body of my
    post-thumbnail-template.php file

    can you post the full code of that template?

    for how-to, see http://codex.wordpress.org/Forum_Welcome#Posting_Code

  18. mehrshadk
    Member
    Posted 1 year ago #

    Thank you for reply dear Alchymyth

    As yo know I'm a layman in website field. However, the codes are:

    <HTML><HEAD><TITLE>Enter Page Title Here</TITLE><META content="text/html;
    charset=utf-8" http-equiv=Content-Type>
    <META name=GENERATOR content="MSHTML 9.00.8112.16470">
    <STYLE type=text/css>BODY {
    	FONT-FAMILY: verdana, arial, sans-serif
    }</STYLE></HEAD><BODY>
    <?php if ( '' != get_the_post_thumbnail() ) {    // some code} else {    // some code}?>
    
    </BODY></HTML>

    These codes are on the paragraph just below the one mentioned by Arley at the bottom of his link to WordPres page.

  19. mehrshadk
    Member
    Posted 1 year ago #

    This is also a link to my post page.

  20. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    you don't seem to have finished the installation of your WordPress site;

    review
    http://codex.wordpress.org/Getting_Started_with_WordPress

    if you don't have the necessary knowledge to get it going, you might need to hire somebody, possibly by posting a job at http://jobs.wordpress.net/

  21. mehrshadk
    Member
    Posted 1 year ago #

    Dear Alchymyth.Yes. I'm agree with you. Using plugins is much more comfortable for me. However, thank you all for support.

  22. ronwords
    Member
    Posted 1 year ago #

    I'm relatively new to WordPress so i'm still trying to get to grips with it all.

    On my front page it shows all the content from the posts i make, but its not show the pictures on the front page when you click on the title on of the post it takes you to the post will image on
    the theme is Newspaper Times

    Any feedback on this issue would be greatly appreciated.

    Thanks

  23. FelicaBlakesleei
    Member
    Posted 1 year ago #

    same here. thanks for putting htis up. this has helped me to the core. seriously appreciated.

  24. mehrshadk
    Member
    Posted 1 year ago #

    Dear ronwords and FelicaBlakesleei
    Hi. I'm not professional in this field at all. However, if you open a new post for your new problems ( even a rudimentary one), a lot of experts will help you. Anyway, if your idea is to show only thumbnails ( as it was my issue in this post), first you should upload images in the size appropriate for a thumbnail (e.g. 150*150 px) onto the media library. Next, in the post editor on the lower right of your post editing pane, there is a button ( called: Featured Image) by which you can select your thumbnail from the library and publish on your specific posts. Now, for hiding contents it is just needed to press more button (in the post editor panel) to put <!--more--> at the top of your post and press publish. You can see your posts shown by titles and thumbnail on your post page subsequently. At last, to hide the title of posts you should put these CSS codes in your style.css file ( for many reason, it would be better for you to create a child theme and do these on that):

    element.style {
    display: none;
    }

    Regards

Topic Closed

This topic has been closed to new replies.

About this Topic