WordPress.org

Ready to get started?Download WordPress

Forums

Recipe Card
[resolved] Enormous gap after recipe title (11 posts)

  1. ToDotBlogger
    Member
    Posted 5 months ago #

    Hi there,

    I am using the side by side layout for my site and whenever I add
    Ingredients:
    To the ingredient side it adds about a 3-inch gap after it. It is very unsightly and I don't know how to get rid of it.
    When I go into the actual card in the editor it keeps adding these spaces.

    Also, for the feature image, what are the correct dimensions to have it centered. It keeps showing the image centered on the post page but for saving and printing it keeps shoving it to the right cutting off half the picture.

    Thanks,

    http://wordpress.org/plugins/recipe-card/

  2. Yumprint.com
    Member
    Plugin Author

    Posted 5 months ago #

    Hi -

    Can you send me a link to a recipe that has the gap?

    As for the off-centered images, we'll be fixing this in our next release. Until then, you can fix it like this:

    (1) Go to your plugin page and find Recipe Card.
    (2) Click edit
    (3) Open the print.css file
    (4) Search for this style: .image-yes .recipe-image
    (5) Add this line to that style: background-position: center; … don’t forget the semicolon at the end.
    (6) Press Update File

    That should fix it for you.

  3. ToDotBlogger
    Member
    Posted 5 months ago #

    Here is a link to one as an example but they all have the unsightly gaps. http://press.flavourfull.ca/creamy-scallop-shrimp-clam-penne/

    Also, for the .css edit, that style is not located in the file. I did ctrl+f and nothing.

  4. ToDotBlogger
    Member
    Posted 5 months ago #

    I tried to add the code to the closest thing I could find and it resulted in a fatal error, so it is far from fixed.

    Any other suggestions?

    Thanks

  5. Yumprint.com
    Member
    Plugin Author

    Posted 5 months ago #

    When I inspected the print.css file on your live site, I found this style:

    .image-yes .recipe-image {
    width: 100px;
    height: 100px;
    position: absolute;
    left: 15px;
    top: 15px;
    background-size: cover;
    }

    Are you able to find that?

    If so, you'll need to change it to look like this:

    .image-yes .recipe-image {
    width: 100px;
    height: 100px;
    position: absolute;
    left: 15px;
    top: 15px;
    background-size: cover;
    background-position: center;
    }

    As for the gaps, are you referring to the gap between the two ingredient section? If so, you can make that smaller by adding this to you styles:

    .blog-yumprint-recipe .blog-yumprint-ingredient-section {
    margin: 15px 0 !important;
    }

    If that's not what you're talking about, can you share more details?

    Thanks!

  6. ToDotBlogger
    Member
    Posted 4 months ago #

    Sorry I took so long. When I tried to troubleshoot this previously I did find and add background position center as you have detailed above and it did cause a fatal error.

    I have looked at the code for the plugin recently and I cannot find this particular code anymore.

  7. ToDotBlogger
    Member
    Posted 4 months ago #

    Yes also the ingredient section px stuff is no longer there either.

  8. Yumprint.com
    Member
    Plugin Author

    Posted 4 months ago #

    Have you updated the plugin since you added those lines? If so, and if you added those lines to the Recipe Card files (instead of your main stylesheet) then they would be erased on update. If you'd like the changes to persist, you'll need to add them to your main stylesheet.

  9. ToDotBlogger
    Member
    Posted 3 months ago #

    I don't know why this is marked as resolved it has not been resolved.

  10. Yumprint.com
    Member
    Plugin Author

    Posted 3 months ago #

    Sorry about that!

    Have you updated the plugin since you added those lines? If so, and if you added those lines to the Recipe Card files (instead of your main stylesheet) then they would be erased on update. If you'd like the changes to persist, you'll need to add them to your main stylesheet.

  11. ToDotBlogger
    Member
    Posted 3 months ago #

    Yes, I will put this as resolved because it's becoming a larger headache than its worth. The .css is nothing like what is shown up here.

    Make no mistake i appreciate the assistance but this is where i get off.

    Thanks!

Reply

You must log in to post.

About this Plugin

About this Topic

Tags

No tags yet.