raeszxtwo
Posts: 6
Joined: Tue Oct 19, 2010 7:39 pm

starting out help

Hello,
First of all, this is exactly what i've been looking for, for a very long time.
Second of all...i'm a little lost :oops:

so i created a quick gallery using the editor. downloaded the folder to my root folder and opened up the custom-highslide.html file and everything worked great. Then i selected to code i needed and implemented that into my portfolio page. http://www.raeheartsdesign.com/2010/ind ... SLIDE.html. But i can not get the large view to show up, only the thumbnail view. It keeps saying "loading...". I went in and changed everything i thought i should have, but it still seems to not be working.

Any insight would be great...thanks!
User avatar
RoadRash
Posts: 8249
Joined: Tue Jul 15, 2008 6:43 pm
Location: Fredrikstad, Norway
Contact: Website

Re: starting out help

Hi,

The paths for the large images are wrong.
See the highlighted changes in the code below.

Code: Select all

	<ul>
	<li>
	<a href="[hilight]../highslide-custom/[/hilight]highslide/images/large/web-BIG-InfocusCoach.jpg" class="highslide" 
			onclick="return hs.expand(this, config1 )">
		<img src="../highslide-custom/highslide/images/thumbs/web-BIG-InfocusCoach.jpg"  alt=""
			title="" />

	</a>
	</li>
	<li>

	<a href="[hilight]../[/hilight]highslide-custom/highslide/images/large/web-BIG-PFhp.jpg" class="highslide" 
			onclick="return hs.expand(this, config1 )">
		<img src="../highslide-custom/highslide/images/thumbs/web-BIG-PFhp.jpg"  alt=""
			title="" />
	</a>
	</li>
	<li>

	<a href="[hilight]../[/hilight]highslide-custom/highslide/images/large/web-BIG-TallPinesLodge.jpg" class="highslide" 
			onclick="return hs.expand(this, config1 )">
		<img src="../highslide-custom/highslide/images/thumbs/web-BIG-TallPinesLodge.jpg"  alt=""
			title="" />
	</a>
	</li>

	<li>
	<a href="[hilight]../[/hilight]highslide-custom/highslide/images/large/web-BIG-Treasuredbouquet.jpg" class="highslide" 
			onclick="return hs.expand(this, config1 )">
		<img src="../highslide-custom/highslide/images/thumbs/web-BIG-Treasuredbouquet.jpg"  alt=""
			title="" />
	</a>

	</li>
	<li>
	<a href="[hilight]../[/hilight]highslide-custom/highslide/images/large/web-BIGPCPub.jpg" class="highslide" 
			onclick="return hs.expand(this, config1 )">
		<img src="../highslide-custom/highslide/images/thumbs/web-BIGPCPub.jpg"  alt=""
			title="" />
	</a>

	</li>
	</ul>
Hilde
Highslide Support Team

Overview of my Highslide sample pages: RoadRash.no
raeszxtwo
Posts: 6
Joined: Tue Oct 19, 2010 7:39 pm

Re: starting out help

Success! http://www.raeheartsdesign.com/index-HIGHSLIDE.html
Thanks so much for the quick reply....i see that is a habit of yours and it is very much appreciated!

A couple more things if you could please...
ÔÇó how do i center my thumbnails within my page? Do i change the highslide CSS or my main css?
ÔÇó How do i add captions to the bottom of each large image? in the dark grey bar i put at the bottom of each pop up...
ÔÇó And i've been searching around your forum and cant find a thread pertaining to one gallery per page of a portfolio site. I would like to have one gallery per page within my site. Do i create each one within the highslide editor? or copy the code and replace images for each page?

thanks in advance!
rae
User avatar
RoadRash
Posts: 8249
Joined: Tue Jul 15, 2008 6:43 pm
Location: Fredrikstad, Norway
Contact: Website

Re: starting out help

1)
Highslide doesnÔÇÖt center the images. You need to do it by adding width to the highslide-gallery div so it fits around the thumbnails, and then center the div using margin: 0 auto
This CSS should center your thumbs:

Code: Select all

.highslide-gallery {
	width: 694px; 
	margin: 0 auto;
}
2)
You will find this markup below each image in your gallery:

Code: Select all

<span class="highslide-caption"></span> 
You can add your text inside the span.

3)
Do what suites you best ÔÇô either copy the code from the first gallery and replace the image files, or use the editor to create the code and thumbnails/large images.
Hilde
Highslide Support Team

Overview of my Highslide sample pages: RoadRash.no

Return to “Highslide Editor”