Images on your PubWriter page must be hosted somewhere online.

Be sure you have the rights to use the images you do use, I know many people who've been hit with big $ penalties for using an image without permission (there are law firms who have built entire businesses around enforcement). Keep in mind under the terms of use, you are 100% responsible for any content you post on your pages.

Dropbox option¶

If you want to use dropbox to host your images (as I often do), you need to modify the URL, unless you are using a Public dropbox folder. And unless you signed up for Dropbox before 2012, you likely don't have a Public folder.

It's an easy switch.

Change:

https://www.dropbox.com/s/e4u7mfni3byibt5/must.jpg?dl=0

into:

https://dl.dropboxusercontent.com/s/e4u7mfni3byibt5/must.jpg

The main reason I prefer dropbox is because if I modify an image, it will be automatically updated on my PubWriter page as well.

Inserting an image on a Pubwriter (or AuthorDock) page:¶

In order to insert a single image, it has to first exist online and be linkable. Sites like Imgur make this pretty simple, but you can also use Dropbox and Flickr if you pay close attention to the URL.

IF you do use Dropbox (which I recommended), then put all your images in your PUBLIC folder so you easily get the correct dl.dropboxusercontent.com link. If you don't have a Public folder, see the note above.

Basically, you type the following syntax:

![](image url)

If you want the image to have an active link, you do it the same way you create a regular hyperlink in markdown, be sure to pay notice where the [] and () have been added:

[![](http://selfpublish.org/pix/authordock.jpg)](http://www.authordock.com)

Making images responsive (if it is not being done automatically)¶

Most of our themes automatically make all images responsive, however there may be cases when you need to do this manually.

If the image is not responsive, you'll need to add a little HTML:

class="img-responsive"

To center the image, you'll need to add the <center> tag.

<center><img src="http://i.imgur.com/Hg8LQUul.png" class="img-responsive" alt="Hired!"></center>

Here's a video walkthrough:
https://youtu.be/nPiVhq7Hvos

Note It's also important (for the sake of Google searches) to add the alt= tag.

Here are a few helpful websites to bookmark:

https://www.sizzlepig.com

Slideshows¶

If you want to embed a slideshow on a page, there are a few options.

One of the fastest ways is to create an album and embed the code for the slideshow. Many sites offer the option, and Flickr is one of the better-known ones that also provide 1TB of photo storage!

Here's a sample page:

http://sandbox.selfpublish.org/flickr.md

(to view the MD file that created that page, just click on the pencil at the bottom of the page)

I often use Imgur, but you need to create an album first.

Here's an example:

http://gamewarden.net/photos.md

(you can see the MD code at: http://gamewarden.net/pubwriter/photos.md

~Brian