Less is more.

    Artwork Tutorial

    helpful-guy

    Changing your images on your Artist Website is one of the most common tasks you will want to do. Fortunately it is a relatively painless process. These instructions may look strange at first. Once you have successfully added your first image, however, repeating the steps should be easy.

    Also – if all this is too time consuming for you, let us know and we can do everything for you (our hourly fee is on the site, and we can give you a quote beforehand…. but most usual updates are done in an hour).

    Please note – the images and instructions included below may not look exactly like your actual website’s Dashboard – as the software used to run your Artist Website is always being updated. However, it shouldn’t be so different that you can’t follow these instructions relatively easily.

    We suggest opening your Artist Website Site, your Artist Website Dashboard, and this Tutorial in different Browser Tabs – so you can refer to them all at the same time. (Alternatively, you may wish to print a hard copy of this guide).

    It is important to note, if your site has a Thumbnail Page there is an additional step for adding Thumbnails to those pages, but you should start by adding large images to a Slideshow.

    Also, another type of method exists for on once-only page images like Cover Pages and Bios – we’ll call these Feature Pages (coming soon).

    Adding Images to Your Slideshow

    Adding a New Image

    First, make sure your images are sized according to our guidelines. For some artists we may have given you specialized image sizes – refer to our original correspondence for these exact dimensions.

    You can add new images to your Slideshow pages by first opening up the Page you wish the image to appear in. Login to your site, and hit Pages, in your menu. You should see a list of all your Pages. Click on Edit or the Title to edit. (If you are unsure which Page you wish to add your image to, open several and hit view page to see if it is the Page you were after.)

    Leave in all the text in the text edit box (this just contains instructions for the website to display your Slideshow).

    To add an image, hit the double rectangle symbol that looks a little like an old-fashioned slide, next to Upload/Insert (underneath your Page Title). It should look something like this – highlighted here in gray.

    When you do, you should see a window that looks something like this.

    Click Browse… to find the image on your computer, then Upload.

    You should then see a window something like this below.

    This is where you add your Titles, Media, and Dimensions to your image, as applicable.

    • Title. Where your work’s Title should appear. Replace the text that’s already there (something like appears above) with your actual work’s Title. (eg. Francis-Picabia-Bathers to Bathers).
    • Caption. For your second line of text. Often this is the Year the work was completed, but it could also be the media or dimensions – check your own site for details.
    • Description. For your third line of text. Some sites do not have a third line of text – if so, leave this blank. Others use this for media or dimensions, etc. Again, refer to other images to see what text applies to you.

    (If you are interested, the second Alternate Text field allows you to display some text in place of the broken image, if the image fails, for some reason. If you do everything correctly, filling in this field is unnecessary.)

    Click Save All Changes when you are done entering this information. Do not click Insert Into Post (this is already done by the Slideshow command).

    Click Update to update the Page if you like, and refresh your Artist Website to see the new image in your Slideshow.

    Deleting Images From Your Slideshow

    You may wish to delete images appearing in your Slideshow that are old or out of date. To do so is easy.

    Please note – some websites may have a blank white (or black) image to indicate the end of a slideshow. Please do not remove this image without contacting up, as it may useful for other performance reasons.

    To delete an image, hit the Upload/Insert image symbol as you did above (it is a rectangular shape and looks like an old fashioned slide).

    When you see a window like the below appear, click on the tab on the top that says Gallery, and the number of images already in that gallery. Here it says Gallery (5).

    You should next see a page with a list of thumbnail images in your Slideshow (below). This may run over to several pages if you have a large number of images. Click Show next to the image you want to delete.

    You should see something again like this.

    Click Delete (which is unfortunately just below the area covered by this screen shot). It will tell you “You are about to delete (Title.jpg). Click Continue.

    Click Save All Changes, and you’re done.

    Changing the Order That Images Appear in Your Slideshow

    Similarly, changing the order in which your images appear is easy. Repeat the above steps (Upload/Insert rectangle image symbol > Gallery) until you see a list of all the images in your Slideshow.

    You should see a box next to the Show link for each image. These will likely have numbers in them, like 1, 2, 3, 4, 5.

    Simply changing the numbers here will change the order that the images appear (1 is the first image that appears). Click Save all changes to save your changes. Your new image order should now be live on your site.

    Adding a New Thumbnail Image

    Adding a new Thumbnail image takes little more steps than adding new Slideshow image. However, it is a series of simple steps to follow, in order, and most people find working through these once makes changing Thumbnails easy, with practice.

    First, find the Page that your thumbnails appears. (Tips on finding the right Page were covered in the Slideshow tutorial, above.) It should look something like below. (If you see a page of code gobbledegook, hit the Visual tab, on the top right hand corner of the following image).

    * Tip – if you wish to have a larger window to work in, the bottom right hand corner of the last screen shot shows three diagonal lines. Clicking on this and dragging down with your mouse button depressed will give you a larger window to work in.

    Your thumbnail images appear in an invisible grid – indicated in editing mode by a series of dashed gray boxes.

    Now, you will need to work out where you want to place your new Thumbnail image. Perhaps you want to shuffle each existing images down some places, and add the new one at the front? Or perhaps you want to add a whole new line of thumbnail images above? Or below?

    All are relatively easy. We’ll deal with shuffling all the images down one (or more) places first.

    Shuffling Images Down the Grid Order

    Use the 3D glassy blue button on the right of your text box, and scroll down to your last Thumbnail image. Click on the image, then without releasing your mouse button, drag the thumbnail to the next empty grid square (or any grid square thereafter) where you wish it to appear. Release the mouse button. It should be in the place you want it to appear.

    Repeat the process with other Thumbnails until you have the positioning you want. Click Update to save your work at this point. When you look at your website you should see your new thumbnail grid, with empty ‘Spare’ spaces at the top ready for new thumbnails.

    Adding a New Line of Thumbnail Images

    If you wish to add a new line of Thumbnail images to the top of your grid, click anywhere on the upper row of images. (If you wish to add a new line of Thumbnail images underneath you should, of course, click anywhere on the lowest line of images. However – this step is often unnecessary, as new empty blank lower rows are often included for you).

    Clicking on the row activates a series of table buttons for you. The one you want is the Add Row Above button, that looks something like this.

    Click it, and a new line of empty squares should appear for you at the top of your grid.

    Adding In a New Thumbnail Image

    The process for adding a thumbnail is much the same as adding a larger image, with two small differences.

    First, however, you need to select the right place in your Grid you want your thumbnail to appear. Click anywhere inside the right gray dashed box that you wish your Thumbnail Image to appear in.

    Click the Upload/Insert image rectangle, and upload your image, just as you did before.

    Now, you can leave out details like title, caption, and description.


    Where it says Size, change it from something like the above to the Thumbnail option. When done, click on Insert into Post.

    Your Thumbnail image should now appear in the right place. Click Update to save your work.

    Linking Thumbnails to Their Larger Images

    There is one further step you will likely want to make with your Thumbnail images, and that is to make the images a link, so that readers are taken to a larger version of the work, when they click on them.

    Firstly, open your published Artist Website Site in another Tab, and find the larger image you want to link to, live on screen. This is likely via clicking through a published Slideshow, until you see the right image appear.

    Now, highlight the URL that is in your Browser’s address bar. It will likely be something like the following

    -

    -

    Note that the last bit (#3) is the third image in the slideshow, #4 is the fourth, and so on.

    Copy the whole address (including the hhtp://), by hitting Control + C (Apple + C on Macs). Now you have the address of the image you want to link to stored on your clipboard.

    Next, go back to your Thumbnail editing page, and click on the Thumbnail image you want to make into a link to select it.

    Hit the little link symbol in the post toolbar, which looks a little like this

    When you click on it you should see a new window pop up, like this

    Prepare to fill in the details as follows:

    • Link URL. Delete any text that may already appear in this field. Press Control + V (Apple + V) to paste the URL you copied in before to your larger image.
    • Anchors. Leave this blank.
    • Target. Leave this as Open in this window / frame
    • Title. Insert some text here if you want visitors to see any text, such as a Work’s title, when they hover over the image.
    • Class. Leave this as it is.

    And hit Update. Update your whole Page, and your Thumbnail should now link to its proper larger image!

    Deleting an Unwanted Thumbnail Image

    This is super easy – just click on the unwanted image, and hit delete on your keyboard to get rid of it.

    Any questions? Clarifications? Discoveries? Add them here, or send us an email.

    Leave a Reply