Scrapping Older Posts, etc.

Resource: Pocket at Blogger Help

Discovered on Kathy’s Blog Just Being Crafty

I am trying something new. I found a very cool site called Jing Project that allows you to video and narrate onscreen instructions. I created this video tutorial in Jing, but I must warn you there is only 5 minutes, so it’s very fast (well if it plays straight through...LOL). Also make sure you use your scroll bar on the side to move the video up/down and right/left as the capture video I did was quite large. I did not make any retakes, so for what it’s worth, you are welcome to view the video by clicking on the image below, and when the link opens click on the start arrow:

Step 1 - Create your image

Create an image (GIF, JPG or PNG). My OLDER/NEWER/HOME buttons are in PNG format, because I prefer the transparent background. Make sure your images are no larger than the following:
110 pixels in width (96 dpi) I always make mine much larger such as 1100 x 1100 pixels 300 dpi and resize for clarity.

Step 2 – Upload your finished image Upload your finished image to your favorite photo hosting site and get the direct link code. I like Photobucket and Scrapbookflair. Add these codes to your planning document, by inserting them as the DIRECT IMAGE LINK in this code:

<img src='DIRECT IMAGE LINK'/>

Step 3 – Backup your blog template.
You can find directions to do that here.

Step 4 – Change your HTML code.
Go to CUSTOMIZE/LAYOUT/EDIT HTML and check the EXPAND widgets box.

You will be looking for and replacing 3 pieces of code (one for each link in your blog NEWER POSTS, OLDER POSTS and HOME. One of my favorite key strokes are the CTRL+C (copy) and the CTRL+V (paste). You can highlight and copy and paste for each section.

{SAMPLE INSTRUCTIONS}

A. Highlight <data:newerPageTitle/> with your cursor, and then click the CTRL+C (COPY) keys together.

B. Go to the HTML, and press the CTRL+F (FIND) keys and then put your cursor in the box, and hit your CTRL+V (PASTE) keys and you will paste the code you are looking for into the box.

C. Go to your planning document and CTRL+C copy the <img src='DIRECT IMAGE LINK FOR NEWER'/> with your actual link in the code.

D. Go back to the HTML and replace the <data:newerPageTitle/> and replace it by highlighting it an using your CTRL+V paste keys.

E. Do the same step for each portion of the code.

You will find and replace <data:newerPageTitle/> with the digital image you scrapped for newer (next) posts {See SAMPLE instructions above}

You will find and replace <data:olderPageTitle/> with the digital image you scrapped for older (previous) posts

You will find and replace <data:homeMsg/> (only the first one) with the digital image you scrapped for home

Step 5 – PREVIEW your blog.
Because you are only seeing the first page of your blog, you will have to trust that the NEWER and HOME buttons are working if the OLDER POSTS button is visible.

Step 6 – Save Template and View your blog.

Find the Word Document Instructions HERE.

Here’s to more happy scrapping, and
Hugs from the heart,
Jeanette