Need HTML help displaying photo on page
mrhoni
Registered Users Posts: 173 Major grins
I have unveiled my site and am trying to setup a new page similar to how I setup my Investment, Products and FAQ pages in the legacy Smugmug.
Here is what I was doing to build my HTML and now I can't seem to figure out where to get the same info:
In the "myPhotoLinks", the first link is for the gallery and the value comes from the Gallery Settings
the src for the photo comes from right click on the photo in the gallery and Copy Link and pick just the photo number and the value replacing the &k= with _ and get rid of the rest after the next &
Example: /www.mrhoni-photography.com/Private-Galleries/Products/29856346_fvckCH/1#!i=2567459897&k=4XrfvmR&lb=1&s=A provided 2567459897_4XrfvmR. Putting the -M.jpg means to use the Medium size file. Could use other sizes as needed.
Here is the gallery I'm trying to pull a photo from
http://www.mrhoni-photography.com/Private-Galleries/Holiday-Mini-Session-On-White/n-bVspJ
I was trying to use the 5th photo of the 8 photos in this gallery. I have right click protection turned off so you can Copy Link, Copy Image Address
This is a snippet of the HTML code currently used and working on the Products page that I want to do similar on the new pages I'm building. Problems finding the same type info for the href and img src as was found for the pPoducts page.
<div class="boxBottom">
<div class="myPhotoLinks">
<a href="http://www.mrhoni-photography.com/Private-Galleries/Products/29856346_fvckCH/1#!i=2567459897&k=4XrfvmR&lb=1&s=A">
<img src="/photos/2567459897_4XrfvmR-M.jpg" alt="image" />
</a>
</div>
<div class="imageTitle">
<b>Standout</b><br />
</div>
<div class="imageSubTitle">
Starting at $50<br /><br />
</div>
<div class="myTextLinks">
Standouts are a frameless and exciting product to hang and display your selected session images. A Standout is printed on photo paper, laminated and mounted onto a thick lightweight synthetic backing. A fantastic option is to mount the print on a sustainably harvested solid bamboo panel. <br /><br />
Standouts are available in sizes from 8x12 to 20x30.<br /><br />
</div>
<div class="spacer"></div>
</div>
Here is what I was doing to build my HTML and now I can't seem to figure out where to get the same info:
In the "myPhotoLinks", the first link is for the gallery and the value comes from the Gallery Settings
the src for the photo comes from right click on the photo in the gallery and Copy Link and pick just the photo number and the value replacing the &k= with _ and get rid of the rest after the next &
Example: /www.mrhoni-photography.com/Private-Galleries/Products/29856346_fvckCH/1#!i=2567459897&k=4XrfvmR&lb=1&s=A provided 2567459897_4XrfvmR. Putting the -M.jpg means to use the Medium size file. Could use other sizes as needed.
Here is the gallery I'm trying to pull a photo from
http://www.mrhoni-photography.com/Private-Galleries/Holiday-Mini-Session-On-White/n-bVspJ
I was trying to use the 5th photo of the 8 photos in this gallery. I have right click protection turned off so you can Copy Link, Copy Image Address
This is a snippet of the HTML code currently used and working on the Products page that I want to do similar on the new pages I'm building. Problems finding the same type info for the href and img src as was found for the pPoducts page.
<div class="boxBottom">
<div class="myPhotoLinks">
<a href="http://www.mrhoni-photography.com/Private-Galleries/Products/29856346_fvckCH/1#!i=2567459897&k=4XrfvmR&lb=1&s=A">
<img src="/photos/2567459897_4XrfvmR-M.jpg" alt="image" />
</a>
</div>
<div class="imageTitle">
<b>Standout</b><br />
</div>
<div class="imageSubTitle">
Starting at $50<br /><br />
</div>
<div class="myTextLinks">
Standouts are a frameless and exciting product to hang and display your selected session images. A Standout is printed on photo paper, laminated and mounted onto a thick lightweight synthetic backing. A fantastic option is to mount the print on a sustainably harvested solid bamboo panel. <br /><br />
Standouts are available in sizes from 8x12 to 20x30.<br /><br />
</div>
<div class="spacer"></div>
</div>
0
Comments
You can get an image link or an embed link by going to the gallery, finding your image and clicking on: Share > Get a Link. There you will find several links you can use in your html code.
Here is the breakdown of your code above:
--- The link to where you will go on click---
--- The Image source Link (truncated in this case)---
--- Closing tag for the first line---
You can change the click link independantly from the image if you want an image from one place and it to go to another place on clicking it.
I hope this will help you along.
Thanks Scott