• Resolved wonders41

    (@wonders41)


    Hello.
    I love this Theme. Alex has done a wonderful job creating it.

    My website is irunbyfaith.com

    On my site home page the featured article titled “Welcome to iRunByFaith.com”, the featured image “Welcome” picture is cutoff or cropped on the sides. You can see part of the W and E are chopped off. I do not know why… or understand.
    How can I fix this to show the entire picture and how to fix it so that is doesnt happen on future FEATURE Images as well.

    Actually none of the images are really lined up properly. The small thumbs on the left are not great and when viewed on phone some of the borders are cut off of images in the middle section.
    still the featured main image is causing all sorts of problems,.

    I have tried working with this just cant figure it out.

    Looking for help. Thank you!

Viewing 15 replies - 1 through 15 (of 18 total)
  • You can fix it by asking your designer or whoever made original image http://irunbyfaith.com/wp-content/uploads/2014/07/welcome-irunbyfaith1-720×340.jpg
    to make it proper, not “cut off”.

    You can also help us all here on this forum :
    -by learning some CSS
    -learning how to use tools like Firebug ( https://getfirebug.com/)
    for the beginning.
    Instead of asking for every small issue (like http://wordpress.org/support/topic/change-the-date-font-size-and-color-on-the-featured-home-page – 46 posts!) – try solving some of it by yourself (like this trivial issue with thumbnail image), before you ask a question.
    After doing above mentioned, if you really cannot solve the issue – feel free to post it.
    Mike

    Thread Starter wonders41

    (@wonders41)

    Obviously I don’t know how to do it. That is why it was posted. I have tried many hours worth, I am sorry to have offended you Mike. Some things people are better at than others are. I’m sure you are an expert in things I am not… and same for me that you are not.

    It may be easy but not for me. I don’t have the solution to this problem.

    If you want to extend your help then I will gladly accept.I’m in need of help.

    Btw I did the image in question …. again I don’t have a clue.

    Ok,
    I’m not expert (there’s always someone who is better) neither trying to play such a role here – just trying to help if I can (my advice above for Firebug is also useful – takes small effort to learn how to use it, but gives you great control when inspecting elements of any website). And, no – you didn’t offended me.
    But – forget it – again:
    – your image on http://irunbyfaith.com/wp-content/uploads/2014/07/welcome-irunbyfaith1-720×340.jpg is “cutoff” (“W” and “E”), just click that link and look at the image (dimensions are OK for Hueman featured thumbnail – 720X340 px)
    -if you made it – I don’t understand why you cut this letters, and now asking “why they are cuttoff”?
    Simply – make another image (same dimensions) were “Welcome” is visible in whole, upload it instead existing one (“set featured image”) – and that’s it.
    This will not solve same image in sidebar – since it is 160X160 px by theme default (square) – so take this also into account when creating basic image (720×340) that is rectangle – it really gets truncated to square for sidebar thumbnails.
    Try this, see how it behaves and LMK if there are still problems.
    Mike

    Yup, Mike is spot on – you need to learn some basic web development skills if you are going to make any progress on your site.

    We all started somewhere, I learnt HTML, CSS, Photoshop, SEO etc etc all through trial and error, reading up and over time I became pretty good at it. Certainly not related to my day job but you need to put the effort in as you will spend more time asking questions than if you just research and work out how to do it yourself 🙂

    If you really don’t have the time or the aptitude then I suggest you find/buy a WP theme that really is 100% drag and drop customizable. If my 4 year old can touch type and do 10 words p/m already on my PC, there really is no excuse for anyone not to be a little tech-literate 😉

    Thanks for “support” @alex997 – sometimes I think I’m wrong explaining so trivial things again and again… 😉
    BTW, very nice & clean site you have there – if I make ask now: how did you removed usual CSS, JS & similar links from main page source, obviously good for speed optimization?
    Some good plugin, suppose – never have time (though it is a must!) to spend time examining this part of WP (being CMS, it’s normally heavy on resources when loading, by default).
    Any advices, PLS 😉
    Mike

    Thread Starter wonders41

    (@wonders41)

    It’s all good fellows. No big deal. . I thought this was the place to come for “help”.
    I didn’t know crap about css until a friend on here explained. Honestly I have learned tons of stuff that I never knew. I’m sure it’s simple stuff but new to me regardless. And I am still learning.
    As far as the image on my site. .. I didn’t cut it off. Its a full image that says welcome with all letters w to e… I uploaded the full image but when it’s inserted to my webpage then it is cropped or cut off and I do not know why. That’s my problem.
    Can either of you fine gentleman provide me a solution? I would really appreciate it.
    I have split my head open trying to resolve it with no success ha.

    All of the images were uploaded in full. They were not cropped

    Help?

    Btw I do not have Firefox so didn’t know of I could use the firebug

    Yes, this is right place to come for help regarding Hueman theme, and lot of people here are trying to give it.
    Please read your posts in this thread carefully:
    -did you mentioned before (until now) that you uploaded original image through media library and it got cropped by WP media library (I don’t think it has to do anything with Hueman featured thumbnails)?
    -NO, of course – so how can anybody (not only me) understand that it is you real problem, just examining your website?
    -if you don’t post right question, how can you expect correct answer?
    -“I didn’t know crap about css ” – and you wanted to make CSS modifications of WP theme?
    Bad news – not only CSS, sometimes you need PhP (WP is written in PhP) and sometimes even jQuery or JavaScript.
    -good – you say you are learning, I believe you

    OK – next step – please upload your original image anywhere, so I can download it. I’ll test it on my local playground and inform you further.

    Rest:
    Firebug – you have lite version for Chrome here https://getfirebug.com/releases/lite/chrome/ – more than enough for a beginner (really don’t know your favorite browser, hope it’s not something Ubuntu based, for example – if it’s IE, forget it for any serious web developing).
    That is not only tool of this kind (Firebug is just my favorite):
    – for Chrome you have native tool and instructions here https://developer.chrome.com/devtools/index
    Also – Google is browser independent tool – use it, after you search this forum, 99% of explanations on Hueman forum can be found also on Google.
    Mike

    Thread Starter wonders41

    (@wonders41)

    Mike,

    here is the full image. go to this page and click on the picture WELCOME.
    http://irunbyfaith.com/irunbyfaith-com-i-run-faith/

    hopefully you can see what im talking about.

    thanks much for your help

    and I am on IE. I guess that is bad too.

    @wonders41 – Looks fine to me in both IE and Chrome. So I am unsure what the issue is. There are no surrounding divs that could potentially be contracting the image in the middle, so as long as you specify the correct height and width in the img tag then the image should display correctly. I’d recommend getting to grips with image manipulation tools such as GIMP to create images in the exact size you want users to see them. That way you aren’t decreasing performance by loading a big image file that then is subsequently shrunk.

    @mike – Thanks for the site compliments. Not quite sure what you mean about removing CSS and JS – they are all there, they are just combined and compressed by W3 Total Cache plugin. This does indeed increase speed – and IMHO is essential for any wordpress site.

    Thread Starter wonders41

    (@wonders41)

    thanks for the reply back.
    the issue is the WELCOME picture on the center of home page is cut off on each end. The W and E are missing in the picture welcome.
    you can see the issue here
    http://irunbyfaith.com/

    im trying to figure out a fix for it

    @alex997,
    you already helped me – by “CSS & JS etc” I meant how the page is compressed. Funny – I’m using W3 Total Cache for a long time – but with default settings (simple page caching).
    Even with these defaults, it increases loading time speed at lest 1 sec or more – but obviously have to go to “plugin school” – wasn’t aware that it can do more compression.
    Yes, loading time is very important SEO factor, amongst else (SEO is my basic occupation, WP support + some WP development – I do it for fun).
    Thanks again for pointing to right direction – I’ll do the rest myself.

    @wonders41,
    -I’ll be back as I look site in Chrome (OK – even IE, though I’m not a big fun of it, except for test purposes)
    – at the moment, have to make a break – but I’ll solve your problem, don’t worry

    Thread Starter wonders41

    (@wonders41)

    thanks fellows!
    patiently waiting Mike 🙂

    @wonders41,

    I looked at your site using chrome(the only browser I use) and it looks fine I can see “welcome” from “w” to “e”.

    Thread Starter wonders41

    (@wonders41)

    I resized the photo to 720×340 and then uploaded the new size. .. and it worked.
    So I guess all images should be this size for featured post?

    Thanks to everyone

    Yes,
    as suggested before, by all supporters in this thread(glad to meet them, also got some good suggestions on my question, like from @alex997, thanks again, Alex 😉 you finally “executed” proposed solutions (dimensions 720X340 px).
    I’ve examined your website in:
    -Firefox 30
    -Chrome (writing this post from Chrome)
    -IE 8 – though I don’t consider IE as serious browser, just a “must have” & “support it when you have to”
    -Yandex browser (if you heard about it)
    -Thor browser – anonymous “deep web” browser based on Mozilla & Gecko
    – don’t own Mac – so I didn’t used some emulation websites – but suppose it’s OK there too

    Results – your website behaves normal in all above – so, “be happy, don’t worry” – at least for this “issue”.
    You don’t need to run Regenerate Thumbnails plugin – since everything looks OK.

    -But – you have to understand couple of … :
    Nobody (at least, most supporters on this forum) has a need to behave like “teachers”, just trying to help
    -you’ve got a lot of useful info in this thread – please follow

    -your issue was “trivial” – but before posting a question, try to find solution, or as @alex997 wrote “We all started somewhere… all through trial and error”

    And finally – please mark this [resolved] – if you think that all help offered from all persons included in this thread solved your problem.
    Cheers to all,
    Mike

Viewing 15 replies - 1 through 15 (of 18 total)
  • The topic ‘Please Help with Image Thumbnails Sizing. Featured Image’ is closed to new replies.