Three formatting questions

  • Unknown's avatar

    Hello Happiness Engineers,
    I have not been able to figure out these three issues and can use your help. here they are in order of importance to me. there’s a bonus issue too:
    * Home page: The main image should fill more of the space. instead, there is an awkward white space between navigation bar and the image and a bit too much white space at the bottom of the image. I do not see any spaces in the html code that i can eliminate or any other way to fix. please help.
    * All pages – e.g. on “find a store” page – even though the images are supposed to right justify and wrap, they only partially wrap and so there is more awkward white space where text resumes AFTER the image. You can see this on the ‘find a store’ page. This has been an ongoing problem. I really could use a solution. thank you.
    * social media icons: every other web site has an option to plug in tiny little icons for Twitter, FB, Instagram, etc – I would love those three for mine at the upper right hand corner. how to install? thanks.
    * gallery images – it would be great for all the pics to display as the same size – as they do on the backend when I’m editing the gallery – but they don’t. Help?
    * paypal button – I’d love to add a paypal button on each design. i understand you strip that code off of sites. I won’t ask why, just is there an option to get it to work – that would be wonderful.

    there, that’s three questions, sort of. Your help is appreciated. thanks, D

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

  • Unknown's avatar

    Hey there!

    * Home page: The main image should fill more of the space. instead, there is an awkward white space between navigation bar and the image and a bit too much white space at the bottom of the image. I do not see any spaces in the html code that i can eliminate or any other way to fix. please help.

    It looks like this image is embedded in your page instead of as your header, that’s why there’s extra space. You can remove it from the page and add it as your header in your Customizer. Or you can add this code to the CSS pane in your Customizer to reduce the whitespace above it:

    .hentry {
    	margin-top: -32px;
    }

    and to reduce the whitespace below it:

    img.alignnone.wp-image-1005 {
    	margin-bottom: 0;
    }

    * All pages – e.g. on “find a store” page – even though the images are supposed to right justify and wrap, they only partially wrap and so there is more awkward white space where text resumes AFTER the image. You can see this on the ‘find a store’ page. This has been an ongoing problem. I really could use a solution. thank you.

    I only see one image on this page. Are there supposed to be more images?

    This happens because of the location of the <img> tag in the code of your page. Part of this is happening because of the way you’re using the Header 3 tags. It’s splitting your content into several chunks, which are then seen as separate things.

    I’ve fixed this for you for now by removing the tags that separated those two parts of text in the text editor.

    * social media icons: every other web site has an option to plug in tiny little icons for Twitter, FB, Instagram, etc – I would love those three for mine at the upper right hand corner. how to install? thanks.

    We have a guide for setting this up here:

    http://en.support.wordpress.com/add-social-media-buttons-to-your-sidebar-or-footer/

    * gallery images – it would be great for all the pics to display as the same size – as they do on the backend when I’m editing the gallery – but they don’t. Help?

    Can you give me some more details here? A link to the gallery you’re having trouble with would be great. And whether the images in the gallery are appearing too small or too large?

    * paypal button – I’d love to add a paypal button on each design. i understand you strip that code off of sites. I won’t ask why, just is there an option to get it to work – that would be wonderful.

    We strip certain types of code for security reasons, but we have a guide for setting up Paypal buttons here:

    http://en.support.wordpress.com/paypal/

    Let me know if you have more questions!

  • Unknown's avatar
    sunnysideartstudio · Member ·

    Hi Shawna, thanks for your prompt response. I am working through your answers.

    a. css – thanks. that worked!
    b. gallery images – the gallery in question is on the home page: http://www.sunnysideartstudio.com I did a work around to some extent by rearranging the photos so the sizes don’t seem so different but they still are. Example: #224h, #113, and both 106 and 204 towards the bottom should be the same size but aren’t. your guidance is appreciated.
    c. wrapping images – that still is an issue. please check out this link
    http://sunnysideartstudio.com/stores-carrying-sunnyside-art-studio-greeting-cards/
    and you’ll see the large amount of unwanted blank space between “suggestion!’ and “Downtown”
    d. soc media icons – i got lost on all the uploading, etc. with mailchimp the icons are just there and I simply add them to the page. I like the ones on your site :)
    more later. thanks.

  • Unknown's avatar

    b. gallery images – the gallery in question is on the home page: http://www.sunnysideartstudio.com I did a work around to some extent by rearranging the photos so the sizes don’t seem so different but they still are. Example: #224h, #113, and both 106 and 204 towards the bottom should be the same size but aren’t. your guidance is appreciated.

    The only way to truly fix this is to make sure the images you include are all the same size. You can do this in our image editor if you’d like:

    http://en.support.wordpress.com/images/image-editing/

    Or you may be interested in a different style gallery, like tiled which displays all images as squares:

    http://en.support.wordpress.com/images/gallery/

    c. wrapping images – that still is an issue. please check out this link
    http://sunnysideartstudio.com/stores-carrying-sunnyside-art-studio-greeting-cards/
    and you’ll see the large amount of unwanted blank space between “suggestion!’ and “Downtown”

    This is really happening because of the formatting you have set for your text. You’re using Header 3 and Header 4 all over the place. In HTML, these tags are really meant to be used as page headers and subheaders. So they split your content. The best way to fix this is to highlight all of the text in your editor and change it back to Paragraph. Then, maybe just turn the headers bold instead of into Headers.

    d. soc media icons – i got lost on all the uploading, etc. with mailchimp the icons are just there and I simply add them to the page. I like the ones on your site :)

    Thanks! It took a long time to find those!

    It looks like you got a few uploaded though! So, let’s see if I can help you get those fully set up. It looks like you uploaded image for Twitter, Facebook, and Instagram. Can you give me links to those profiles and I’ll help put the code together for you?

  • Unknown's avatar
    sunnysideartstudio · Member ·

    Thank you so much. that would be great:

    Twitter: @sunnysidecards

    http://instagram.com/sunnysideartstudio

    https://www.facebook.com/SunnysideArtStudio

  • Unknown's avatar

    Alright. Here’s the code you can use. Copy this entire code and enter it into a Text Widget.

    <div><a href="https://twitter.com/SunnysideCards"><img title="Twitter" src="https://sunnysideartstudio.files.wordpress.com/2014/03/twitter.png" alt="Twitter" width="35" height="35" /></a> <a href="https://www.facebook.com/SunnysideArtStudio"><img title="Facebook" src="https://sunnysideartstudio.files.wordpress.com/2014/03/facebook.png" alt="Facebook" width="35" height="35" /></a> <a href="http://instagram.com/sunnysideartstudio"><img title="Instagram" src="https://sunnysideartstudio.files.wordpress.com/2014/03/instagram.png" alt="Instagram" width="35" height="35" /></a></div>

  • The topic ‘Three formatting questions’ is closed to new replies.