I have got a fun tutorial for you to try this weekend on your blog! A while ago I did a tutorial on creating a header ad banner and judging from my Google Analytics it was very popular so I thought I’d turn it up a notch and making an updated version which changes on refresh! On the desktop version of this blog, TheFashionTechnologist you will see ad banner at the top of the page, if you refresh the page you will see another ad. I have three in a rotation, a Missguided, Topshop and Net-a-porter one.
If you would like your banner ad to change on refresh like this, add the following code to your theme (WordPress Only) functions file or if you are cool, to your custom functions plugin.
A lot of bloggers have a cool little post signature at the bottom of their blog posts, I do too! I usually paste it in every time which is so long and laborious. It’s quite naughty coming from me because I could have coded something along time ago but haven’t!
I put together this code snippet that I am using now which you can copy and use on your blog. What I have done is made a shortcode, a shortcode is an easy way to paste code into a blog post without pasting the actual code and it getting messy. Also it’s easier to remember and saves time.
I could have created a tutorial which creates the signature automatically at the bottom of a blog post, but if you are like me and have been pasting it in for ages, it will be duplicate signatures on old posts and in all honesty I can’t be asked going through all the old blog posts and deleting. However if you aren’t like me and a signature is new for you I shall make this tutorial for you soonish.
Okay so to the code!
Paste the following into your functions.php file which is in your theme. You can find this via FTP or if this is alien to you go to your theme editor from within WordPress backend and find it that way.
Replace INSERTURLOFSIGNATURE with the image url of your signature.
return'<img src="INSERTURLOFSIGNATURE" alt="my blog post signature"/>';
Whilst on the phone recently with the lovely Brenna Mader of Wanderlustandglitterdust.com helping her set up theFEED, she mentioned that she now knew what a favicon was because in theFEED settings it asks you to upload a favicon!
I was like say whatttt! Then thought about it for a second and realised I’ve seen a lot of bloggers sites without favicons so she was actually in good/bad company =]
If you are reading this and thinking what the hell is she going on about (this post is for you), a favicon is a cute little icon which displays next to your site name in your browser.
Above is a screenshot of my Google Chrome right now, you can see I have three tabs open, one is this blog, the second is Brenna’s and the third is my Gmail. Next to each website name is a little icon – that is a favicon!
A favicon is usually 16px by 16px and traditionally a .ico file. To upload a favicon to your blog do one of the following:
Open your theme editor and check (use CMD + F on mac to use your browsers find tool) you don’t have any code that starts with
<link rel="shortcut icon"
If you do, your site is already set up to have a favicon, in this case change the image url in the “src” attribute.
If you don’t then, before the close of the tag insert the following code, insert the below code, swapping our ENTERIMAGEURLHERE for the destination of your favicon image.
Hello, the #30daysofcoding may be over but did you really think you would be rid of me?! (Or that I would want to stop!)
Each Thursday I will be giving a tutorial on a new piece of code I have added to the blog so make sure to check them out! Today I am attending a blogger’s event with Chloé which I am so excited about! We will be giving advice to bloggers on how to ensure there blog is as engaging to their readers as possible as well as answering any other questions they might have for us regarding their blog.
For this post however, I will be showing you how to add resource pages to your site. This will allow you to share and celebrate other resources you read and follow with your readers.
It is my final day for #30daysofcoding eek! Make sure to still check out this blog though as myself and Chloé will be giving you an insight to a fashion technologist life as well as give some coding tips along the way!
Today I will be showing you how to add an extra tab to your already added sidebar widget that includes a twitter stream. Gaining a following is important on any social media platform when having a blog. Therefore displaying your twitter clearly showing what you tweet about will help this.
Today I will be showing you how to add another widget to your sidebar, in this case it will be stream of post’s which a user can select to read or share. At the moment our feed is set up to show the 30daysofcoding category, however after the 30daysofcoding is complete we will have a category showing exactly what Chloé and I are getting up to in the fashion technology world, whether it be an event we are attending, or a day spent coding. By completing this we will have a stronger level of engagement with our readers.
I have chosen to use tabs as in the future I will have this widget doing multiple other things with other tabs, but really it is an extra you may wish to just shown the live feed by itself.
The 404 (page not found) page can be neglected on a website which is a shame as it could be a gold mine. When a user sees a 404 page they might leave the website, however if it is super engaging they could find more content. Therefore for todays task I have made the 404 page more engaging in order to increase the likely hood of the reader staying on the blog and finding something new.
To achieve this I have decided to use a tag cloud, again it is rare that a blog actually does something exciting with a tag cloud but I thought it was the perfect opportunity to use it and use it in an unique way!
I know I keep going on about it but only 3 days left of #30daysofcoding… I don’t know what I am going to do with all my spare time! Well I will still be working but regular working hour will fall back into place I am sure! Yesterday was far from a normal day coding as I attended a Go Think Big event which Chloé (founder of chloédigital) was speaking at. It was so nice to see how enthusiastic girls around the age of 16 are about technology! The blog will have a full post on the day in a few days so make sure to check it out!
Today I have added a top bar containing images which links to top tags on the blog. A great way for users to access your content is creating topic images that can be used as links to tags or categories that you don’t have in your main navigation. You can place this in your sidebar but we have decided to place them at the top.
You may well of noticed that I might have a slight obsession/love with font awesome, at any given opportunity to use font awesome on this blog I have. It is a simple and effective way to use icons and removes the risk of pixelated ones. Therefore today I am dedicating an entire post to the lovely font awesome.
Happy Monday! I hope you have all had a lovely weekend! Yesterday was all about Pinterest and today I am sticking with Social Media and moving onto to Twitter! I will be using a shortcode again but this time it will allow me to add tweetable links to a post instead. This shortcode will make your content tweetable for your readers quicker and easier.
This is a simple task and should not take you more than an hour, an easy task to start our final week of coding! Can you believe it?!