PixelScripts User Guide and Help


Table Of Contents

  1. Introduction
  2. Terms
  3. How To
  4. Stuck?
  5. Get More Help

Introduction

Thank you for downloading a PixelScripts Template! These diary/website layouts are completely free to use, as long as you follow the terms of use.

You can use them on your personal website, or however you please. Most use them for diaryland.com.

Up-to-date information can be found at http://pixelscripts.diaryland.com on the Help page, FAQ page, and the Terms page.

Back To Table of Contents?


Terms

To use the material and downloads found on PixelScripts, you must follow these terms:

  1. A visible link to PixelScripts must be on all pages containing my work, please. The link must go to http://pixelscripts.diaryland.com.

  2. Do not redistribute the downloaded material (for free or profit). You may not take anything found at PixelScripts and put it on your own site for downloading purposes.

  3. Do not direct link the images. You can't do it anyway.

  4. Please keep additional credits, such as image links or brush credits, intact. To remove a credit may not only be a violation of my Terms of Usage, but someone else's TOU. My work isn't created from thin air, and it's important that all parties involved receive credit for their work.

  5. Websites engaging in commercial endeavors are prohibited from using PixelScripts linkware. This is important, as I often use fonts and images that are only free for non-profit use. You cannot purchase the rights to use any of the material found on this website, either.

  6. Yes, you may alter and customize anything you download, but doing so does not exclude you from the other terms of usage. A visible link to PixelScripts must remain. For specific details you may contact me, as something like this is best handled on a case by case basis.

  7. I don't ask that you dig through my entire website to find a solution to your layout problem, but I do require that you review the FAQ and Help page carefully before you contact me with a problem. I'm happy to help you, but understand that I receive a lot of "please help me" emails, and I'm not going to prioritize questions that have already been answered on those two pages.

Back To Table of Contents?


How To

There are 3 steps to getting a PixelScripts template onto your diaryland account.

  1. Find a host for the images
  2. Edit the template
  3. Upload to diaryland

Here are how to do each of those steps in detail:

I. Find A Host For The Images

You can skip this section if you downloaded an imageless template.

  1. Before you begin editing your template, your should look for a place to host the images that came with your layout. This section is something you will have to do on your own, but here is what I would do:
  2. Go to http://www.villagephotos.com. They provide free image hosting services, and you can upload images there, and remotely link them on your diaryland account.
  3. All you have to do is sign up for a a new account and upload all the images for your template.
  4. When you upload the image, the address to it will be something like http://www.villagephotos.com/pubbrowse.asp?selected=171769. Find out where the image is, and record the URL, you will need it for Step Three below.
  5. If you need more help uploading images to villagephotos.com then check the tutorial below.

II. Edit The Template

  1. Navigate to the folder that contains your downloaded template, so you can work on it.
  2. Right click on the index.html file, and navigate to "open with".
  3. In the slide out window, if you do not see "notepad" then click on "choose program" and select "notepad".
  4. Inspect each line of code carefully and look for words in capital letters, and words enclosed in <!--these comment tags-->. This will assist you.
  5. If your SignMyGuestbook.com username is the same as your diaryland.com username, and you like all the links as is, then all you will have to edit is the address of the images.
  6. Where the code indicates <!--PUT THE URL OF WHATEVERIMAGE.JPG IN THE NEXT LINE-->, place the complete web address of the image that you downloaded where it says something.gif or something.jpg. This means that you will have to have an image host.
  7. Do the same edits for the older.html document, and your done.

III. Upload To DiaryLand

  1. If your template is fully functional, then it's ready to be uploaded.
  2. Open up index.html in notepad (so you can copy and paste all the code).
  3. Go to diaryland.com.
  4. Log in.
  5. Go to the "edit your template" page.
  6. You will have four options on the next page that pops up. You will want to edit the first two.
  7. To edit the index page, choose "click here to change how each of your entry pages look".
  8. Highlight all of the text in notepad, press and hold the ctrl button and press C to copy ( or go to edit > copy ) Then go on diaryland, and press ctrl + V to paste (or edit > paste).
  9. Do the same for older.html by going back to the "edit your template page", and then "click here to change how your older.html archive page looks"

Back To Table of Contents?


Stuck?

Uploading Images To VillagePhotos.com

  1. First you need to set up an account at villagephotos.com. That should be the easy part.
  2. Login
  3. On the right, where it says "my albums" click "photos".
  4. On the next screen, near the top, click "Upload New Images to this folder."
  5. In the gray box, uncheck "Automatically optimize JPEG images". This will cause the box to expand suddenly.
  6. Click one of the browse buttons (Just pick one).
  7. Navigate through your computer until you find the desired image (it will be a .gif, or .jpg).
  8. Click the file once to highlight it, then click "Open" on the dialog box (or press enter).
  9. Click "upload".
  10. Click "Click here to continue!"
  11. On the next screen, Near the middle you will see thumbs of your images. Click "click to zoom" under the image you just uploaded.
  12. Look for something like:
    The public URL
    URL of this image for sharing on websites, auctions, bulletin boards, etc.
    http://image1ex.villagephotos.com/pubimage.asp?id_=1676040
  13. Copy the http://image1ex.villagephotos.com/pubimage.asp?id_=1676040 part.
  14. Now go into your template's HTML code. Look for something like this:
    <!-- IN THE NEXT LINE PLACE THE URL OF BLAH.JPG WHERE IT SAYS BLAH.JPG-->
    <img src="blah.jpg" border="0" />
  15. Change blah.jpg to that long address. In my case I would change it to this:
    <img src="http://image1ex.villagephotos.com/pubimage.asp?id_=1676040" border="0" />
  16. Make absolutely certain that you didn't add any spaces. That is the #1 mistake most people make. Like this:
    <img src=" http://image1ex.villagephotos.com/pubimage.asp?id_=1676040 " border="0" />
    See the space at the beginning and end?

Editing Your Image Links

The #1 question in my inbox is, "Why won't my image show up?". The first thing you will need to do is get your images uploaded to a server that will allow you to remotely link image files, such as villagephotos.com. The help section directly above this one will cover villagephoto uploading, and etc.

You need to find out what the web address is for your image. It will be long, and start with http://.

Go into your code, and look for something like:
<!--THE URL OF BLAH.JPG GOES IN THE NEXT LINE, DO NOT ADD SPACES-->
<img src="blah.jpg" border="0" />

You need to place the address of your image where it says blah.jpg (or .gif). For example, if the address of my image was http://image1ex.villagephotos.com/pubimage.asp?id_=1676040, I would make my image link look like this:
<img src="http://image1ex.villagephotos.com/pubimage.asp?id_=1676040" border="0" />

Sometimes you see something like this:
<!--THE URL OF BLAH.JPG GOES IN THE NEXT LINE, DO NOT ADD SPACES-->
<table cellspacing="0" cellpadding="0" border="0" width="640" height="375" background="blah.jpg" class="box">

The procedure is the same, I would make my new line of code look like this (To save space, I just put http://image.....):
<table cellspacing="0" cellpadding="0" border="0" width="640" height="375" background="http://image....." class="box">

Another common image link will look like this:
<!--THE URL OF BLAH.JPG GOES IN THE NEXT LINE, DO NOT ADD SPACES-->
<td width="275" style="background-image: url(blah.jpg); background-repeat: no-repeat; ">.</td>

This can be a bit tricky for some, the address goes where it says "blah.jpg", not where it says "url". If it was me editing the code, I would make my line of HTML look like this:
<td width="275" style="background-image: url(http://.....); background-repeat: no-repeat; ">.</td>

Notice that the web address goes in the (parentheses), without spaces.

Don't let all of this seem hard. When in doubt, just remember, all you have to do is replace the whateverfile.jpg or whateverfile.gif with the web address of your image, and just don't add spaces that aren't already there, or have been included in the web address.


Copy, Cut, Paste, & Select All

These features are usually available in any program. You can typically access them by going to Edit > Copy, Paste, Cut, or Select All.

Or, you can use the keyboard shortcuts Ctrl+C for copy, Ctrl+V for Paste, Ctrl+X for Cut, and Ctrl+A for Select All.

Try it out, with the mouse highlight the text in bold below, and hold down the ctrl button (located on both the far bottom left and right of the keyboard). With ctrl still held down, press "c".

Highlight me, and press ctrl+C!

Open up a text editor, or anything that allows you to type. (You could even use the address bar above, just don't press go!) Place the mouse in the typing area, and click on it, like you would so you could type in that area. Now press ctrl + V, as you did with ctrl + C. You just "copied" the highlighted text, and then "pasted" it into the textarea.

But, what if you wanted to completely grab a portion of text, and put it somewhere else, like you wanted to move a sentence at the bottom of a document to the top. You would press ctrl + X (cut) instead of ctrl + C (copy) and then you could just paste as normal.

You can also do copy / paste / cut with folders and files. Just highlight the desired folders / files, and press ctrl + c, v, or x as usual.

To select an entire body of text located in a text box, just press ctrl + A, or go to Edit > Select All. Try it out, click in the text box below, and press Ctrl + A:

Back To Table of Contents?


Get More Help

Are you still stuck? My email is jenni@jaydemail.com, I'll try to help you.

Here are some useful links:

HTML Related
W3C Schools
Dave's Site
Dodo's New World
Lissy Explains
HTML Goodies
HTML Palace
Web Monkey
Your HTML Source
Web Tao (my own HTML site)

Misc.
How To Use DiaryLand

Back To Table of Contents?