H E R ALD LE AD E R P H OTO.COM

H E R ALD LE AD E R P H OTO.COM a guide to uploading and posting Version 1 of probably many to come Jan. 1, 2008 Heraldleaderphoto.com upload guide 1

TABLE OF CONTENTS Pre-preparing (stuff you gotta do before you get started) 4 Preparing images 4 Creating thumbnails 4 Preparing to export 5 Export and Upload 6 Uploading to Vmix 7 Using and manipulating the embed code &om Vmix 7 Lo'ing into Wordpress 8 How Heraldleaderphoto home page is laid out 9 Writing your post 10 Posting a Soundslides 11 Posting a video 12 Writing a description 12 Using the <more> tag 13 Using tags 13 Uploading Thumbnails 14 Using the Optional Excerpt 15 Heraldleaderphoto.com upload guide 2

Using Categories 16 Using the Timestamp 16 Post author 16 Publishing and reviewing 17 Summary of &equently used info 17 Heraldleaderphoto.com upload guide 3

PREPARING YOUR SLIDESHOW Using Soundslides for your slideshow Pre-preparing (stuff you gotta do before you get started) Make sure you have done the following before using Soundslides: 1. Have the appropriate shells folder in place. [Download it here and follow the ReadMe instructions.] 2. Have the Soundslides settings xml files on your hard drive. You will use these xml files later. Preparing images Correct for color, crop and sharpen the images. You do not need to size the images before loading into Soundslides. Captions are imported with the photos and can be edited in Soundslides, though you may find it easier to edit captions in Photomechanic before uploading to Soundslides, particularly if the show is going to be combined with another photographer s (like a basketball or football game). Creating thumbnails You will most likely need two thumbnails to use later when making your post in Wordpress. This is a good time to do that since you re working with images. You can always come back and do it later. You will need two sizes of thumbnails. The smallthumbs are 70 x 70 ONLY. The largethumbs we use for Second Look and WIP are 290 px wide. They can be any height.. Make em and save em somewhere to use later. You can add a 70 or 290 at the end of the filename to help me remember which one is which when uploading later. Heraldleaderphoto.com upload guide 4

Preparing to export After you have your show ready, do two important things: Insta(ing a she( - this is what gives us a pageview per photo Click the Template tab, then shells, and select hlphoto.com from the drop down menu. Insta(ing a she( - loading settings. This sizes and styles the show. Under the same Template tab, click Display, then Load settings. You will select the appropriate Soundslides settings xml file you downloaded previously. One xml file is to be used for audio slideshows, the other is used for non-audio slideshows. Be sure to select the correct one. This file sets some pre-define standards and styles and sizes the photos and show appropriately for Heraldleaderphot.com s windows. You can alter some of the settings if you wish after you load the xml file, but do not change the output size. Heraldleaderphoto.com upload guide 5

Export and Upload When you export a Soundslides, all the important stuff is put into a folder called Publish to Web. You will be doing the following things to that folder: 1. Rename it. Use the same naming conventions we use for our photos (080101myshow) 2. Upload it. There is a place on the Heraldleaderphoto.com where this folder needs to go. You will be given login instructions in a separate document. Once you navigate to the Uploads folder, select the appropriate year and month and ftp your entire folder there. Remember your folder name. An example of the directory (file path) you ll be using later is this: http://www.heraldleaderphoto.com/wp/wp-content/uploads/2008/01/080101myshow/sou ndslider.swf. Heraldleaderphoto.com upload guide 6

PREPARING YOUR VIDEO Uploading to Vmix Using a Vmix video on Heraldleaderphoto.com Until further notice, continue to use Vmix to host your videos as we do now. This sections assumes you know how to do that already. We will be using the embed code to place the videos on our site. That gives us the flexibility to choose which videos go on Heraldleaderphoto.com and how big they are displayed. Views are all credited to the same video, so we re not breaking up our statistics. We have the ability to embed videos from YouTube and Brightcove and other sites if we wish. Using and manipulating the embed code from Vmix As you may already know, we need to remove the Auto Play from the embed code from Vmix. An example of this Before and After is Before: <script language="javascript" src="http://media.vmixcore.com/vmixcore/js?auto_play=1&t=f45cc1d589d9449fc 6dae42cad1c06e1"></script> After: <script language="javascript" src="http://media.vmixcore.com/vmixcore/js?=1&t=f45cc1d589d9449fc6dae42ca d1c06e1"></script> One other important scripting thingy you ll need to know relates to sizing the player. When we make our post in Wordpress, a bit of code needs to be added to the end to make the video play at a certain size. Notice the width=500 and height =342. Examples below: Before: <script language="javascript" src="http://media.vmixcore.com/vmixcore/js?=1&t=f45cc1d589d9449fc6dae42ca d1c06e1"></script> After: <script src="http://media.vmixcore.com/vmixcore/js?=1&t=f45cc1d589d9449fc6dae 42cad1c06e1&class_id=1&width=500&height=342" language="javascript"></script> As you learn to look at this code, you will see the only thing that will change from video to video is the long string of nubmers/letters between the = and &. Heraldleaderphoto.com upload guide 7

USING WORPRESS Wordpress is the way we ( manage our content Logging into Wordpress Log in to Wordpress here: http://www.heraldleaderphoto.com/wp/wp-login.php You will be given usernames and passwords independent of this document. The Wordpress Dashboard - the starting point Wordpress has a great set of intuitive, user-friendly tabs and organization techniques. You will most likely be using the Write and Manage portions most frequently. Heraldleaderphoto.com upload guide 8

How Heraldleaderphoto home page is laid out Heraldleaderphoto.com upload guide 9

Writing your post At this point, you should have your images prepared, whether it be a Soundslides (and have it uploaded) or a video (and have the code from Vmix) or other images and thumbnails for a your show or Blog entry. Click the Write tab. Here is where almost all of your work will be done. Here is a complete tutorial from Wordpress: http://codex.wordpress.org/writing_posts The Writing Place Heraldleaderphoto.com upload guide 10

Posting a Soundslides The post window is crucial to using Wordpress. Especially when we re posting Flash content like Soundslides or embeding videos. To post your Soundslides, click on the Kimili Flash Embed button that is at the far right of your toolbar (circle with blue F). Placing code for embedding Soundslides A window will ask you for the URL to the swf. What the? Well remember way back when you uploaded your Soundslides folder to the server? That s where you determine your file path. In our example in the Uploading section, our file path (URL) was this: http://www.heraldleaderphoto.com/wp/wp-content/uploads/2008/01/080101myshow/soundsli der.swf. As you learn this system, you will find that there is only a few things in this path that will change. The 080101myshow will change every time, determined by the name you give it. This is the Publish to web folder you renamed earlier. You will also notice a date structure here. Inside the 2008 folder will be folders numbered according to the month number (o1=jan, 02=Feb, etc). The soundslider.swf will always be the same. The next window will ask for the height of the swf and the next window will ask for the width. Height = 426 Width = 590 Heraldleaderphoto.com upload guide 11

This Flash embed thing writes the code for you. This code should remain at the top of your post. Anything else, like text, description, other photos or links, should go below it. Posting a video Embedding a video is a little different than embedding a Soundslide. Click on the CODE tab. Don t be afraid. Take the code you got from Vmix and post it straight in the post window. Placing code for embedding a video &om Vmix. The important part here is making sure the code has the auto play removed and has the width and height code added at the end. You may want to go ahead and write your description while still in the CODE mode. If you click on the VISUAL tab, you won t be able to see your embed code anymore - but it s still there. In the example above, you will see the video embed code, then the description, then a link to the Music City Bowl slideshow. TIP: I have found it useful to open a previous post in another tab in my browser and copy relevant code from it and replace the part that is unique for my post. Writing a description Should be obvious. But, please write good descriptions here. It is useful for visitors and also quite useful for search engines. You will be copying and pasting this description and/or parts of it later anyway. Heraldleaderphoto.com upload guide 12

Using the <more> tag If too much of your post description is appearing on the home page or somewhere else, you can use the <more> tag to only make the top part visible. Using tags Don t forget to use tags and keywords to help with searching and organization. Some examples of tags: David Perry, UK basketball, Horse, Derby, Videos, Audio Slideshows, etc. Using SEO SEO is Search Engine Optimization. You will see a group of windows labeled as such under your post window. Copy and past your title and description (or rewrite the description). This is information that search engines will find and help boost our ratings and drive traffic from people who may not find us through Kentucky.com. Heraldleaderphoto.com upload guide 13

Uploading Thumbnails Thumbnails are used in two locations. I would suggest making a habit of loading both sized thumbnails for everything you post until you learn our system. The Second Look feature and the Week in Pictures use what s called largethumb. The thumbnails used in the Videos, Sports, and Blog sections are 70 x 70 px and are called smallthumb. At this point, you are ready to upload these images. They need to be sized before uploading. Browse to find the file and click the Upload button. After it has uploaded copy the link location - you will use this in a Custom Field below. To copy link location, hold down the CTRL key, click on the image, and select copy link location Heraldleaderphoto.com upload guide 14

Paste (cmd-v) the link into the Value field. In the drop down menu, select the appropriate designation for the sized thumbnail you just uploaded. smallthumb = 70 x 70 px. largethumb = 290 px wide x any height. Then click the Add Custon Field button to save it. If you are using the Upload window to place an image in your post, then you can click on the Send to Editor button and it will place it in your post window. Ignore the Send to Editor button when loading thumbnails for the purpose outlined above. Using the Optional Excerpt We will be using optionl excerpts heavily, so don t forget to use this. Keep it short and specific. Heraldleaderphoto.com upload guide 15

Using Categories Categories are crucial to the organization of the site. All of the sections and category linking/sorting functions rely on using these category check boxes. Please make sure to check the appropriate boxes for your post. These check boxes determine how things are placed on the home page. You can add a check box later, if you wish. For example, the Second Look category should not be checked until your post has fallen from the top location on the home page. It is possible that by clicking multiple categories that your post will appear in multiple sections on the home page. That is acceptable to a degree. Use your own judgement. Using the Timestamp Using the Timestamp is also a crucial means to manipulating the content on the site. You can also use the timestamp to publish something in the future. Handy for when you want to work on something ahead of time. Remember that everything on the homepage is placed in order determined by the timestamp (newest material goes to the top of the list). Don t be afraid to change the timestamp to suit your publishing needs. Post author Remember to select the appropriate post author from the drop down menu. Heraldleaderphoto.com upload guide 16

Publishing and reviewing You can save the post as a Draft and come back to it later if you wish. It will not be published until you hit the Publish button. After publishing, please refer to the site to make sure it is working properly. Here is a list of things to check: 1. Did you load the proper Shell in Soundslides? 2. Did you load the proper settings in Soundslides? 3. Did it show up in the proper section (via category and timestamp)? 4. Did the thumbnails show up properly if necessary? 5. Is the description or excerpt too long? Don t forget that <more> tag if you need it. 6. Does the slideshow or video play properly? Check the code... 7. Is your spelling/grammar less than embarrassing? Summary of frequently used info On the homepage: The width of our large posting window is 590 px. The height is whatever. I guess. The small thumbnails are 70 x 70 px and are called smallthumb in the Custom Field The large thumbnails are 290 px wide, any height, and are called largethumb in the Custom Field. They are used in the WIP and Second Look category. Heraldleaderphoto.com upload guide 17