Coding tips for bloggers

coding tips for bloggersI’m a coder from way back. I love the logic of it and I love the elation that comes from solving a problem. I’ve also found it very useful as a blogger.

However, I know not everyone is enamaoured by code as I am. That it can feel a little daunting.

Here a few things that might be useful if you feel like dipping your toe in.

  1. Copyright footer to change year to year.
    It’s nice to have your copyright looking all fresh and sparkly at the bottom of your blog. But it’s a bit painful to remember to update year to year. Good news. You don’t have to. Your computer knows the day anyway, so put it to work. In your footer widget (you access that via appearance > widgets in WordPress) use the following HTML and javascript code within a text widget. Just a little warning – this may slow your site down. So test that first using a tool like Pingdom

    <em>Copyright <script language=”javascript” type=”text/javascript”>
    var today = new Date()
    var year = today.getFullYear()
    document.write(year)
    </script> Your Blog Name</em>

  2. Spacing betweens bullets and numbering.
    Sometimes spacing between your bulleted and numbered lists can look a bit squishy. If you want to space it out, you can use the following in your list code. (In WordPress, go to your text tab within your post.)
    Find the <li> tag, which is what controls the list items. Add this code:

    <li style=”margin-bottom: 6px;”>

  3. Formatting just one word or letter, rather than complete line.
    Ever wanted to apply formatting to just one word rather than the whole line offered by using your headings, ever waned to do more that just changing the colour?
    Ever wanted to go BIG
    The way that works is through the use of the <span style> tag, the BIG was achieved via this code:

    <span style=”color: #ff9999; font-size: 60pt; font-weight: bold >BIG</span>

  4. Changing the numbering start
    Other times you might want to start re-numbering your list half way through. Maybe you want to start at 1 again or maybe you want to apply some formatting mid-way through your list that causes it to restart. Either way, you have the control.
    This time find your <OL> tag, which is what starts your list off, and use this code (replace 2 with wherever you want to start).

    <ol start=”2″>

  5. An easy way to add your blog images to MailChimp
    This isn’t strictly a blog or coding thing, but as bloggers use mailchimp for newsletters, it’s a helpful tip. When you are adding your images to your newsletter, don’t download and upload – that takes forever. Instead use this trick:

    • Go to the picture you want to share, right click and choose copy image address
    • Go into Mailchimp and choose to insert a picture
    • Choose the upload image address option
    • Paste the copied text
    • Remove any reference to resizing
    • While that’s loading up, go back to your site and copy the link address itself
    • Once the picture is loaded, past in the link address

    This saves so much time.

  6. Links should always open in a new tab 
    If I’m reading a blog and I click on a link, I’m surprised by how often I’m taken away from the blog post entirely. Your readers don’t want that and I don’t think the blog author really wants that either. When you add a link, make sure that tick the “open link in a new tab box”. In your code, you want the link to have this little bit in the <a href> tag:

    <a href=”LINK” target=”_blank”>

  7. Click on image to go back to blog post
    When I click on an image associated with my post, I want it to link back to the blog post, not the image itself. I think this is particularly important on my home page where I list my blog posts in short excerpts. I’m old school with my home page but I like the “bloginess” of it. One day I might get around to a landing page. In the mean time, I want to make sure that each image goes to the associated post. You can do that in the image properties, but I think it’s less fiddly just to duck into the code and use this applied before the image code and finished it off with a </a>. Obviously it will be the link to your post, not mine.

    <a href=”http://themummyandtheminx.com/2017/03/30/coding-tips-for-bloggers/”>

    Just a word on doing this – it doesn’t allow you to then open and save an image easily when you are reviewing the post on your mobile. So if that’s the way you like to share back to Instagram or whatever, you’ll need a different method.

Before I finish up, a thought I’d just add a word on HTML and CSS. HTML is the language that the internet has been built on. It’s a basic markup language allowing you to store the content and format the words and images appearing on your web pages. Very simply, you tell the browser what you want to appear and how you would like them to appear and act by using commands enclosed by angled brackets, called tags. You tell the browser when to stop applying the formatting by ending the angled brackets. You can use HTML in the coding editor of your posts and in your widgets.

CSS stands for cascading style sheets. The idea is that your define how you want your website to look and feel, for example how your headings should look, at a top level and then each page refers to that style sheet. It’s basically how themes work – they are set of CSS. The code within CSS looks a little like HTML but there are significant differences. HTML is designed to store content and CSS is designed to customize how the content is displayed.

You can edit both HTML and CSS within your blog. You want to be careful with editing CSS as it will affect your whole site. You also want to be sure that you apply it in such a way that it is not over-written if you update your theme. If you have Jetpack in WordPress you will have an area where you can edit CSS. This applies the CSS over the existing theme so you don’t have to worry about child themes.

I really hope that’s all super helpful. To me, jumping into the code is never a scary thing – it’s an exciting thing. You gain so much more control over the look and feel of your site. Happy coding!

Any other coding tips to share?
Favourite resources?

 

Linking up with Kylie Purtell – Capturing Life and IBOT

23 thoughts on “Coding tips for bloggers

  1. Jenni @unclutter my world says:

    Hi Robyna,

    coding is a foreign language that I don’t think I want to learn. It very much reminds me of algebra, that a struggled with for a long time at school. Which is a nightmare that I’m very happy to leave way back in the past. Thankfully, I have the nearly 18yr old Teen Techie to do all things technical, related to computers and the blog. So far, it has been a brilliant project for the both of us, him getting more into HTML and me enjoying the blogging community, building a business and even becoming reasonably computer savvy. I’m very impressed to discover that you are able to manage the coding required for your blog. It’s an amazing talent, that is in high demand and something which i’m sure your boys would love to experience with you. Jenni xxx
    Jenni @unclutter my world recently posted…BEING MY OWN BOSSMy Profile

    • Robyna says:

      I’ll admit I quite liked alegbra! I am trying to get the boys into coding. I think it should be taught early in schools – not just reserved for the kids who show a lot of potential in math as an added extra. There is just something about solving a problem with code.

    • Robyna says:

      I hope they give you the confidence to try a few things solo – I reckon that the kids are great at tech because they just don’t let it scare them. At all.

  2. Vanessa says:

    This is about the extent of my coding knowledge from the 2000’s in high school haha. It has been super handy though, I know just enough to not be scared of it and enough to work out what I need to do.
    Vanessa recently posted…Hiatusing (Kind Of)My Profile

    • Robyna says:

      I’m always a little confused by what’s possible in blogger as opposed to WordPress – would like to learn more. CSS took a while for me to get my head around but I think I’m there at a theoretical if not technically proficient level.

  3. Jasmine @ Pretty Chuffed says:

    Love this Robyna! And OMG the MailChimp one saves me so much time, I thank you for teaching me that one! I kinda love code a bit, it is so satisfying when you apply something and it actually works. I’ve been considering studying it again, you’ve given me a prompt to research that. X

  4. Kylie Purtell says:

    Great post, Robyna! I know there are going to be so many people who will be so happy you’ve written this post! When I first started blogging in 2009 I had no idea about code. Since then I’ve learnt quite a bit and I know the basics. Having a blogger blog it kinda becomes essential! Thank God for google is all I can say, I’ve never not been able to find the answer to a coding question with the exception of once, when I wanted to add a drop-down menu bar to my blogger blog… it just didn’t work and I couldn’t find a fix via google. And that’s when I said thank god for Fiverr, when a lovely blogger expert was able to get it fixed and working properly in half an hour for $15!
    #teamIBOT
    Kylie Purtell recently posted…Taking Stock {March 2017} | IBOTMy Profile

    • Robyna says:

      So glad it was useful. One of these days I’ll make some pretty pinterest images to make the whole pinning thing easier. It’s something I definitely have to learn more about.

Leave a Reply

Your email address will not be published. Required fields are marked *

CommentLuv badge