The second way is to use HTML to automatically put a signature image at the bottom of every post, past and future--the harder way.
[Here] is the tutorial for the easy way.
The following is the 'harder way.'
create your signature
Create your signature in whatever image editing software that you use. (I personally use GIMP because it is free and works well for what I need)
I would include your name and make the design represent your blog's feel and design. Make it represent you!
upload your signature
Upload your image using whatever image hosting site that you use. (I would suggest Imgur because it is free, doesn't downsize images, privacy settings, is easy to navigate, and loads quickly)
create the code
.post-footer-line-1{
background-image:url(IMAGE LINK);background-repeat:no-repeat; background-position:left left;
height:150px;
line-height:150px;
color:$textcolor;
text-transform:none;
letter-spacing:0px;
font-size:14px;
padding:0px;
border-bottom:0px solid #000000;
}
Replace IMAGE LINK with the direct link for your signature. Then change the height and line-height to the same number that is slightly bigger than the height of your image. The reason you have to make it bigger is so that the footer text doesn't overlap part of your image. background-image:url(IMAGE LINK);background-repeat:no-repeat; background-position:left left;
height:150px;
line-height:150px;
color:$textcolor;
text-transform:none;
letter-spacing:0px;
font-size:14px;
padding:0px;
border-bottom:0px solid #000000;
}
You can also customize other things like the border, text-transformation and such as you'd like.
add the code
Go to your dashboard > design > edit HTML.
Search for this code:
h2.date-header{
Then right below that paste your code. You now have a signature that will appear on every post--past, present, and future--on your blog until you remove/change the code.
Let me know if you have any questions, and I'll get back to you ASAP.
In Christ,
3 comments:
Hi Emily, I followed all of your instructions and when I got to the part on looking for the h2.date-header{ to paste my code underneath it, I didn't have it in my Html.
Please let me know if there is something that I'm doing wrong!
Thanks,
Bekah
Bekah -
Hmm. Did you try using the search tool? Sometimes just scrolling through you can miss sections.
It doesn't have to be directly under the 'h2.date-header{' section. It simply has to be under the '/* Posts
-----------------------------------------------
*/' section. So see if you can find any code that starts with '.post' and put your code underneath that whole section. Make sense? If no,t send me a link to your blog and I'll look at your code. =)
Hope this helps!
- Emily
Thanks! What you said helped a bunch!
In Christ, Bekah
Post a Comment
Leave your thought...