Distorted Slideshow Pictures

Web template support for image problems

Pinned Note Distorted Slideshow Images
Slideshow pages in Allwebco templates do not include image height and width numbers. Some editors, such as Expression Web and Dreamweaver, may add height and widths causing images to appear distorted if you have a mix of different image sizes (landscape and portrait).

See Instead…

Your editing software (Frontpage, Expression Web, Dreamweaver) is adding height and width numbers to the slideshow images in the HTML pages.

Set editor options
Many HTML editors include an option "Preserve existing HTML" or "Retain original source formatting" or something similar. Check the help included with your software or search at Google for this option in your software. You'll still need to remove the height and width code as outlined below if it has already been added to your slideshow.

HTML wysiwyg software options

Solution #1: Edit using a text editor
Allwebco template slideshows prevent pictures from being squished by not having a width and height defined, however, certain HTML editors will add code that can squish the pictures. To solve the problem, open the "slideshow.htm" in Notepad, TextEdit or a plain text editor and do a search for the image code or name="show". The code shown below is all that should be on the line in a Javascript "slideshow.htm" page. There should be no "height=" or "width=". If you have distorted pictures, remove the height and width code:

<img src="gallery/Fgallery1-1.jpg" name="show"><br>

In jQuery slideshows your code may appear similar to the following and should include no height and width code:

<li><img src="slideshows/Fslide1-1.jpg" alt="Slide 1"></li>

Upload using FTP software, otherwise your HTML editor may add these sizes back in.

Solution #2: Edit in your Hosting Control Panel
After you have uploaded or published your webpages, You can edit the sizes out in your hosting control panel login. Check under file manager, or see the help included with your hosting to see how to edit webpages through your control panel.

Fixing this with Frontpage Software option #1:
Open your Frontpage software. Select "Tools" then "Page Options" then "HTML Source" from the menu. Click on "Preserve existing HTML" in these options. This option prevents Frontpage from disturbing any existing template code.

Fixing this with Frontpage software option #2:
Frontpage has a glitch that adds sizes to any image that does not have sizes defined. This solution was sent in by one of our Frontpage users: Choose "Insert" on the main toolbar, then choose "Web Component", "Advanced Controls", "HTML". This allows you to insert HTML code that FrontPage will ignore. It encloses the code as follows:

<!--webbot bot="HTMLMarkup" startspan -->
<!--webbot bot="HTMLMarkup" endspan -->

Related Topics:
Squished Gallery Images
Squished Thumbnails
Changing Page Pictures