Hey, Sweet Pea, LLC. Showit Instructions

Transcription

1 Hey, Sweet Pea, LLC. Showit Instructions 1. Downloading SHOWIT o Go to o Click Install Now. o Follow the prompts to download the software. 2. Setting up an Account o Open SHOWIT o Click New User? Create An Account o Follow the prompts on the screen to setup your account. o For the CODE/ID box enter Hey, Sweet Pea, LLC. o After setting up your account, login. 3. Uploading Style Group o After logging in, click CONTINUE. o You will be prompted with a Getting Started window stating, There are five easy steps that will help you get started. o Click CONTINUE. o In the next window, on the top right-hand side click the IMPORT STYLE button. o Locate and select the.ssg file sent to you by Hey, Sweet Pea. o Once the import is complete click the My Styles tab on the top left of the window. o Select your new website. o The pages will preload in the section on the right. Make sure all the pages are selected with an X next to their titles. o Click the ADD STYLE GROUP button on the bottom of the window. 4. Adding Custom Fonts o At this point you should see your website but you will not see any text. In order to be able to see the text you will have to add the custom fonts we used. o To do this click the SITE tab from the SHOWIT menu bar at the top (Example 1). *Hey, Sweet Pea, LLC. does not own any rights to Showit Hey, Sweet Pea, LLC. Page 1

2 Ex. 1 o Select CUSTOM FONTS. o In the window that appears select ADD FONT. o Locate each of the.swf files that are in your website folder provided by Hey, Sweet Pea. o You will add them one at a time until you have selected and added them all. o Once you are certain you have added all the custom fonts click DONE. 5. Updating Content REMEMBER: You are only permitted to change images, videos, and text. Any alterations to the website other than those permitted will be considered a breech of contract and an infringement on Hey, Sweet Pea, LLC. s rights of release and will be subject to legal ramifications. 5-1 Updating Gallery images: Definition: A gallery image is any image that has been placed within a gallery or thumbnail box meant to be displayed along with other photos of your work. This is different from a non-gallery image which is located directly on a page and is not meant to be moved or transitioned to other photos (such as a header or a headshot on an About page). Select the page you want to edit in the PAGES tab on the left. With the page selected click the LAYER tab. Select the layer for the gallery you want to edit (Example 2). Ex Hey, Sweet Pea, LLC. Page 2

3 Once the layer is selected you will seen it highlighted on the stage with a toolbar above it (Example 3). Ex. 3 Select the ADVANCED button (Example 4). Ex. 4 You should now see all the thumbnails in the panel on the right, labeled IMAGES. To delete images select the image and click the red trashcan icon. 5-2 To add new images: Images that you want to add to your site must first be added to SHOWIT. To do so click the MEDIA button on the bottom right hand side (Example 5) Hey, Sweet Pea, LLC. Page 3

4 Ex. 5 This is your media library. To add images simply drag the images from your computer onto this window. Once all your images show up in this window you can drag them from you re MY MEDIA window and onto your selected gallery panel (Example 6) Ex Hey, Sweet Pea, LLC. Page 4

5 You can order them however you choose by dragging them up and down in the column. NOTE: You will want to make sure that your images you add are properly cropped before adding them to the MY MEDIA window. You do not want the images to have any borders or rounded edges as this will make the photos awkward in the gallery with the other photos. 5-3 Updating Non-Gallery images: o NOTE: It is very important that you know the dimensions of the image you are replacing so that the new image matches. To check the dimension click the layer for the photo you will be changing. With the proper layer selected click the LAYOUT button from the toolbar over the image (Example 7). Ex. 7 Write down all four numbers associated with the size and position of this image. (Example 8) Ex Hey, Sweet Pea, LLC. Page 5

6 You can now delete this layer. Open the MY MEDIA window. Select the image you would like to add. Click the ADD TO PAGE button under the selected image (Example 9). Ex. 9 Close the MY MEDIA window. The new image should be automatically selected. Adjusted the size and position numbers to equal the former image s properties. o NOTE: If the size is Locked click the lock button to unlock the dimensions (Example 10). Ex. 10 The new image should fit precisely where the old image was before. 5-4 Updating copy (text): Select the appropriate text layer (Example 11) Hey, Sweet Pea, LLC. Page 6

7 Ex. 11 Select the ADVANCED button. Click the EDIT TEXT button (Example 12). Ex. 12 Edit the copy as you desire. 5-5 Updating a Vimeo video: Open the proper page. Select the proper video layer (Example 13): 2012 Hey, Sweet Pea, LLC. Page 7

8 Ex. 13 Open the Advanced tab Enter the Vimeo ID Number, which is the 6-8 digit number at the end of the video URL (Example 14). Ex. 14 DO NOT change any other settings. 5-6 Updating a video thumbnail: If the video has a corresponding thumbnail the thumbnail must also be updated. Open the proper thumbnail layer (Example 15). Ex. 15 In the advanced tab select the thumbnail you want to replace. Once you have the thumbnail selected click the Settings gear next to the thumbnail. You want to take note of which page this thumbnail is linked to so that we can link our new thumbnail to the same page (Example 16) Hey, Sweet Pea, LLC. Page 8

9 Ex. 16 Once you make note of the correct page link you can click Cancel. Delete selected layer. Open the Media folder and drag the desired thumbnail onto the thumbnail panel on the right (Example 17) Hey, Sweet Pea, LLC. Page 9

10 Ex. 17 Be sure you keep the thumbnails in the correct order! Once you have your new thumbnail in place select the Settings gear next to the thumbnail. In the new options you want to select the Page link button and then choose the correct page from the pull down menu (Example 18). Ex. 18 Click the Save button at the end of the panel Hey, Sweet Pea, LLC. Page 10

11 Save your project. 6. Video Showit supports Flash Video with the extension ".flv" and MPEG-4 standard container files that contain video and audio data encoded using H.264/AAC with extensions.mp4,.mpv,.mov,.mp4v,.3gp,.3g2. If you add a video file that has one of those extensions, Showit will attempt to read the video as Flash Video and if it cannot play the video, it will add the video file as a package instead. For MPEG-4 files that contain meta data at the end of the file that prevents streaming in Flash, Showit automatically modifies the video file before upload to move the meta data to the front of the file so that it can stream. 7. Mobile /+Site Video When using a Mobile +Site if you want to be able to provide HTML5 video content you will need to provide video compressed in a format that the device supports. With the iphone and ipad it can be a hassle because they do not support FLV and even an mov or mp4 is not good enough. There are specifics on resolution and bitrates that are supported. The iphone Tech Specs indicate that the highest resolution the iphone supports is 640x480 and different bitrates based on mp4 and h.264 and the ipad Tech Specs indicate support up to 1280x720 with varying bitrates. The good news is that if you get your video compressed to work on an iphone or ipad, it will also work directly in Showit in your Flash site. There are a few recommended options for getting video to these devices: If you have Quicktime and purchase a Pro license you can open a video on Windows or Mac and export to the device using one of the settings provided. Use an online converting service like Media Convert which can take a little bit longer for upload and download of the file. Upload to SmugMug which takes care of converting your videos and you can either include directly from SmugMug or download the iphone size and add to Showit. Use YouTube and they take care of all the work also to get it in the right format for playback on these devices. The only issue with that is that YouTube will include a watermark indicating where the video is coming from. There is a full explanation with lots of info on supported formats for iphone here: 8. Publishing Site 8-1 The first step is to make sure you have a subscription to SHOWIT PRO. To do this, click the SITE tab from the SHOWIT menu bar Hey, Sweet Pea, LLC. Page 11

12 Then click SUBSCRIPTION Follow the necessary steps to setting up your subscription. The second step is to make sure that you have your domain name purchased and ready to use. If you need assistance on this, please check out the SHOWIT tutorial: Now that you are subscribed you can publish your site. Click the PUBLISH button on the top right-hand side. Click FULL Enter the appropriate information. Customize your site loader. Select SHOWIT HYBRID HOSTING. If you are hosting through SHOWIT directly you should be done! If your site is not live, or there are errors you can contact SHOWIT directly for assistance. 8-2 If you are using a third party host follow these additional steps: Click on the SITE menu and then EXPORT SITE HTML After you publish your site, click on the EXPORT SITE HTML button (Example 19). Ex. 19 This will open up a window for you to choose a location to save the HTML on your computer. Choose a location you will remember and then click OK. This will create a folder named "site_html" that contains a bunch of HTML files for your site Hey, Sweet Pea, LLC. Page 12

13 Next, you will need to upload the files INSIDE of the "site_html" folder to your hosting account. (DO NOT UPLOAD THE FOLDER "site_html" TO YOUR SERVER) If you want the site to be the front page, typically you would put the contents of the site_html folder at in the root folder of your site (public_html or www folder) on the server. If you have questions on where and how to upload this content to your web host, please contact your hosting provider as they will be the ones to know specifically how their servers work. NOTE: The purpose of this HTML is to be a sort of frame that loads your Flash site from the SHOWIT content servers and also for search engines to be able to index the content of your site. For small changes to the layout and design of your site, you will not need to export and upload your HTML, clicking PUBLISH in SHOWIT will put those changes into effect. o For additional help please check out the SHOWIT tutorial: 9. Favicon To further give your site that special branded touch we have included a favicon! Depending on how you are publishing your site and how you have your hosting setup, follow the instructions here to add your favicon Support For any additional support, SHOWIT has tech support available for free. You can contact them with any questions, big or small, at You can also check out their forum at If you would like additional explanations from Hey, Sweet Pea you can contact our support team at scott@heysweetpea.com or call us at We offer an initial 30 minutes of support for free. Any additional hours will be billed at $45/hour Hey, Sweet Pea, LLC. Page 13