Nikon DSLR forum

This site requires new users to accept that a small amount of member data is captured and held in an attempt to reduce spammers and to manage users. This site also uses cookies to ensure ease of use. In order to comply with new DPR regulations you are required to agree/disagree with this process. If you do not agree then please email the Admins using info@nikondslr.uk after requesting a new account. Thank you.

Moderated by: chrisbet,

Page: 1 2

Publishing images on the internet - Page 2

On my own website.

Rate Topic

Author	Post

Posted: Mon Sep 2nd, 2019 10:49

11^th Post

chrisbet

Joined:	Thu Feb 7th, 2019
Location:	Leigh On Sea, Essex , United Kingdom
Posts:	1502
Status:	Offline

E.g. in the main.css file add or edit existing entries (note

a {text-decoration: none; }

button { background-color: lightblue; border-style: inset; border-color: blue; border-radius: 12px;}

button:hover { background-color: lightgreen; border-style: outset; border-color: green; border-radius: 12px;}

Go here to see the effect - https://octarine-services.uk/guides.htm

____________________
If it is broken it was probably me ....

Posted: Mon Sep 2nd, 2019 10:50

12^th Post

Robert

Joined:	Sun Apr 1st, 2012
Location:	South Lakeland, UK
Posts:	4066
Status:	Offline

OK, Thanks Chris.

I am waiting for my lad to get back to his mothers, then perhaps I can concentrate and make some edits.

This is the file output from Lightroom, which I edited.

The actual images, some were named and had descriptions as you can see in the lower section of the text, there are also some un-populated data holders for filename, title, and caption.

In the current album display, none of these are used. I will try different display features/options within Lightroom, there are many. These are the title and captions I described a little while ago in another discussion. They are in the EXIF but not always used. I am beginning to populate these fields for my images chosen for publication, Flicker seems to pick up on them.

I just opened the 'Main' CSS script, it runs to nearly 800 lines so I won't post it here... :lol:

<!DOCTYPE html>



 <html class="no-js" xmlns:lr="http://adobe.com/lrg/0.0"> 
<head>
<meta cha**et="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Lightroom Gallery</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="assets/css/normalize.css">
<link rel="stylesheet" type="text/css" href="assets/css/main.css">
<link rel="stylesheet" type="text/css" media="screen" title="Custom Settings" href="assets/css/custom.css" >
<script src="assets/js/libs/modernizr.custom.23122.js"></script>
</head>
<body class="has-header" data-pagination-style="scroll" data-pagination-size="20">
<header class="">
<div class="background"></div>
<p class="title">
<strong id="galleryTitle">Lightroom Gallery</strong>
<span id="galleryAuthor"></span>
</p>
<ul class="gallery-meta">
<li id="buttonFullscreen" title="Fullscreen Mode">
<div class="icon">
<svg version="1.1" id="svgIconFullscreen" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 18 16" style="enable-background:new 0 0 18 16;" xml:space="preserve">
<g>
<path class="custom-colorable" d="M5.3871,9.95599C5.19136,9.76858,4.99176,9.85763,4.79376,10.0472l-2.86173,2.74138v-1.55466
c0-0.25257-0.21387-0.45733-0.47767-0.45733H0.47767C0.21387,10.7766,0,10.98136,0,11.23393v3.37367v0.93511
C0,15.79524,0.21387,16,0.47767,16h0.97668h3.5238c0.26377,0,0.47764-0.20476,0.47764-0.45729v-0.93511
c0-0.25254-0.21387-0.45733-0.47764-0.45733H3.34554l2.86694-2.7451c0.198-0.18957,0.30914-0.44923,0.11342-0.63664L5.3871,9.95599
z"/>
<path class="custom-colorable" d="M17.52233,10.7766h-0.97672c-0.26377,0-0.47764,0.20476-0.47764,0.45733v1.55466l-2.86172-2.74138
c-0.198-0.18957-0.39764-0.27862-0.59335-0.09121l-0.93879,0.81254c-0.19575,0.18741-0.08458,0.44707,0.11342,0.63664
l2.8669,2.7451h-1.63258c-0.26377,0-0.47764,0.20479-0.47764,0.45733v0.93511c0,0.25254,0.21387,0.45729,0.47764,0.45729h3.52376
h0.97672C17.7861,16,18,15.79524,18,15.54271v-0.93511v-3.37367C18,10.98136,17.7861,10.7766,17.52233,10.7766z"/>
<path class="custom-colorable" d="M3.34554,1.84973h1.63262c0.26377,0,0.47764-0.20479,0.47764-0.45733V0.45733C5.45579,0.20476,5.24193,0,4.97815,0h-3.5238
H0.47767C0.21387,0,0,0.20476,0,0.45733v0.93508v3.3737C0,5.01864,0.21387,5.2234,0.47767,5.2234h0.97668
c0.26381,0,0.47767-0.20476,0.47767-0.45729V3.21142L4.79376,5.9528c0.198,0.18957,0.3976,0.27862,0.59335,0.09121l0.93879-0.81254
C6.52161,5.04409,6.41048,4.7844,6.21247,4.59483L3.34554,1.84973z"/>
<path class="custom-colorable" d="M17.52233,0h-0.97672h-3.52376c-0.26377,0-0.47764,0.20476-0.47764,0.45733v0.93508
c0,0.25254,0.21387,0.45733,0.47764,0.45733h1.63258l-2.8669,2.7451c-0.19801,0.18957-0.30917,0.44926-0.11342,0.63663
l0.93879,0.81254c0.19571,0.18741,0.39535,0.09836,0.59335-0.09121l2.86172-2.74138V4.7661
c0,0.25254,0.21387,0.45729,0.47764,0.45729h0.97672C17.7861,5.2234,18,5.01864,18,4.7661v-3.3737V0.45733
C18,0.20476,17.7861,0,17.52233,0z"/>
</g>
</svg>
</div>
</li>
</ul>
</header>
<div id="thumbnailContainer">
<div class="thumbnails thumbnail-size-md"></div>
</div>
<div id="loupeContainer" class="show-corners">
<div class="background"></div>
<div class="image-container"></div>
<div class="side-navigation">
<div class="hotspot" id="hotspotPrevLoupe">
<div class="button" id="buttonPrevSideLoupe">
<svg version="1.1" id="svgIconPrevSideLoupe" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30 57" style="enable-background:new 0 0 30 57;" xml:space="preserve">
<path class="icon custom-colorable" d="M0,0v57c16.56854,0,30-12.75989,30-28.5S16.56854,0,0,0z M17.60291,33.87964
c0.34692,0.3291,0.34998,0.85938,0.00708,1.18457l-1.2431,1.17828c-0.34326,0.32532-0.90277,0.32245-1.24969-0.00647
L9.53137,30.9408L7,28.54163l8.20038-7.77301c0.35333-0.33508,0.92334-0.33801,1.27271-0.00671l1.26569,1.19952
c0.34943,0.3313,0.34613,0.8714-0.00739,1.2063l-5.7149,5.41711L17.60291,33.87964z"/>
</svg>
</div>
</div>
<div class="hotspot" id="hotspotNextLoupe">
<div class="button" id="buttonNextSideLoupe">
<svg version="1.1" id="svgIconNextSideLoupe" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30 57" style="enable-background:new 0 0 30 57;" xml:space="preserve">
<path class="icon custom-colorable" d="M30,57V0C13.43146,0,0,12.75989,0,28.5S13.43146,57,30,57z M12.39709,23.12036
c-0.34692-0.3291-0.34998-0.85938-0.00708-1.18457l1.2431-1.17828c0.34326-0.32532,0.90277-0.32245,1.24969,0.00647l5.58582,5.29523
L23,28.45837l-8.20038,7.77301c-0.35333,0.33508-0.92334,0.33801-1.27271,0.00671l-1.26569-1.19952
c-0.34943-0.3313-0.34613-0.8714,0.00739-1.2063l5.7149-5.41711L12.39709,23.12036z"/>
</svg>
</div>
</div>
</div>
<div class="info-container">
<div id="loupeMeta"></div>
<ul class="lateral-nav">
<li id="buttonPrev">
<svg version="1.1" id="svgIconPrevLoupe" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 45 45" style="enable-background:new 0 0 45 45;" xml:space="preserve">
<style type="text/css">
.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#231F20;}
</style>
<path class="icon custom-colorable" d="M25.20105,14.76864l-8.2004,7.773l2.5314,2.3992l5.5858,5.2952c0.3469,0.3289,0.9064,0.3318,1.2497,0.0065
l1.2431-1.1783c0.3429-0.3252,0.3398-0.8555-0.0071-1.1846l-5.5864-5.2948l5.7149-5.4171c0.3535-0.3349,0.3568-0.875,0.0074-1.2063
l-1.2657-1.1995C26.12435,14.43064,25.55435,14.43354,25.20105,14.76864z"/>
</svg>
</li>
<li class="count"><span id="countCurrent"></span> of <span id="countTotal"></span></li>
<li id="buttonNext">
<svg version="1.1" id="svgIconNextLoupe" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 45 45" style="enable-background:new 0 0 45 45;" xml:space="preserve">
<style type="text/css">
.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#231F20;}
</style>
<path class="icon custom-colorable" d="M19.79895,14.76864l8.2004,7.773l-2.5314,2.3992l-5.5858,5.2952c-0.3469,0.3289-0.9064,0.3318-1.2497,0.0065
l-1.2431-1.1783c-0.3429-0.3252-0.3398-0.8555,0.0071-1.1846l5.5864-5.2948l-5.7149-5.4171
c-0.3535-0.3349-0.3568-0.875-0.0074-1.2063l1.2657-1.1995C18.87565,14.43064,19.44565,14.43354,19.79895,14.76864z"/>
</svg>
</li>
</ul>
</div>
<div id="loupeCloseButton">
<svg version="1.1" id="svgIconLoupeClose" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 45 45" style="enable-background:new 0 0 45 45;" xml:space="preserve">
<path class="shape-x custom-colorable" d="M14.77881,17.30074l5.212,5.2222l-5.0831,5.0924c-0.3476,0.3484-0.5746,0.7624-0.2308,1.1067l1.5682,1.4763
c0.3436,0.3443,0.8045,0.2596,1.1521-0.0886l5.0825-5.093l5.2119,5.222c0.3536,0.3547,0.9244,0.3578,1.2741,0.0073l1.2677-1.27
c0.3497-0.3507,0.3465-0.9224-0.0071-1.2768l-5.2119-5.2221l5.0828-5.0925c0.3475-0.3485,0.5429-0.8259,0.1994-1.1702
l-1.6474-1.4921c-0.3438-0.3443-0.6936-0.1803-1.0411,0.1679l-5.0828,5.0929l-5.212-5.222
c-0.3537-0.3546-0.9241-0.3577-1.2742-0.007l-1.2672,1.2698C14.42171,16.37464,14.42491,16.94624,14.77881,17.30074z"/>
</svg>
</div>
</div>
<script type="text/javascript">
var LR = LR || {};
LR.images = [ {"id": "809804", "exportFilename": "1972-09_JCB_Fairfield_Site-Edit", "title": "", "caption" : ""},
{"id": "809852", "exportFilename": "Bristol_Roller_Edit_2", "title": "", "caption" : ""},
{"id": "826267", "exportFilename": "24440008", "title": "", "caption" : ""},
{"id": "827808", "exportFilename": "Aynsome_Park_O_K", "title": "", "caption" : ""},
{"id": "827788", "exportFilename": "Aynsome_Park_Chalets", "title": "", "caption" : ""},
{"id": "825898", "exportFilename": "24450006", "title": "", "caption" : ""},
{"id": "825877", "exportFilename": "24450005", "title": "", "caption" : ""},
{"id": "812023", "exportFilename": "Gordon_s_Pool_Frame-Edit-Edit", "title": "", "caption" : ""},
{"id": "826589", "exportFilename": "30330020", "title": "", "caption" : ""},
{"id": "818288", "exportFilename": "Img0331", "title": "", "caption" : ""},
{"id": "818706", "exportFilename": "Img0360", "title": "", "caption" : ""},
{"id": "826074", "exportFilename": "24450035", "title": "", "caption" : ""},
{"id": "826834", "exportFilename": "25770003", "title": "", "caption" : ""},
{"id": "827829", "exportFilename": "Highfield_Rd_Drilling", "title": "", "caption" : ""},
{"id": "828213", "exportFilename": "51670008", "title": "", "caption" : ""},
{"id": "827700", "exportFilename": "Buccleuch_Court_Flats_0", "title": "", "caption" : "Flats in Buccleuch Court"},
{"id": "828052", "exportFilename": "Barrow_School_Gate", "title": "", "caption" : ""},
{"id": "818804", "exportFilename": "North_Lonsdale_Hospital_Roof_b", "title": "", "caption" : ""},
{"id": "828113", "exportFilename": "Gough_Pergoda", "title": "", "caption" : ""},
{"id": "828176", "exportFilename": "Risedale_Stairs", "title": "", "caption" : ""},
{"id": "827246", "exportFilename": "24450017", "title": "", "caption" : ""},
{"id": "828091", "exportFilename": "Gough_paving_gate", "title": "", "caption" : ""},
{"id": "816744", "exportFilename": "DSC_7275", "title": "", "caption" : ""},
{"id": "826399", "exportFilename": "30330007", "title": "", "caption" : ""},
{"id": "819188", "exportFilename": "DSCN0087", "title": "", "caption" : ""},
{"id": "812804", "exportFilename": "DSC00909", "title": "", "caption" : ""},
{"id": "824413", "exportFilename": "DSCN0842", "title": "", "caption" : ""},
{"id": "824774", "exportFilename": "_NOR0019", "title": "", "caption" : ""},
{"id": "813786", "exportFilename": "DSC_5105", "title": "", "caption" : ""},
{"id": "813906", "exportFilename": "DSC_5115", "title": "", "caption" : ""},
{"id": "824930", "exportFilename": "DSC_0347", "title": "", "caption" : ""},
{"id": "815229", "exportFilename": "CNV00016", "title": "", "caption" : ""},
{"id": "823292", "exportFilename": "DSCN0664", "title": "", "caption" : ""},
{"id": "828813", "exportFilename": "DSC_2354", "title": "", "caption" : ""},
{"id": "831625", "exportFilename": "DSC_4014", "title": "", "caption" : ""},
{"id": "285205", "exportFilename": "_NOR3603", "title": "", "caption" : ""},
{"id": "826248", "exportFilename": "24440010", "title": "", "caption" : ""},
{"id": "826288", "exportFilename": "30330001", "title": "", "caption" : ""},
] </script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="assets/js/libs/jquery-1.10.2.min.js"><\/script>')</script>
<script src="assets/js/main.js"></script>
</body>
</html>

____________________
Robert.

Posted: Mon Sep 2nd, 2019 12:05

13^th Post

Joined:	Sun Apr 1st, 2012
Location:	Carthew, Cornwall, United Kingdom
Posts:	6969
Status:	Offline

If you populate the EXIF data for all your images then when you come to publish it is all there in the image xmp files.
I populate the EXIF immediately after import of RAW images. Makes it easy to find images in the future as well.

____________________
Still learning after all these years!
https://nikondslr.uk/gallery_view.php?user=2&folderid=none

Posted: Mon Sep 2nd, 2019 13:46

14^th Post

chrisbet

Joined:	Thu Feb 7th, 2019
Location:	Leigh On Sea, Essex , United Kingdom
Posts:	1502
Status:	Offline

I just opened the 'Main' CSS script, it runs to nearly 800 lines so I won't post it here... :lol:

Lol - that's a small one - some of the Ultra css files run to 1000s!

Just add the a & button styles at the bottom of the file - cascading means that any later directives in the file replace any earlier ones and stylesheets loaded last override earlier ones too.... that can be fun sometimes !

____________________
If it is broken it was probably me ....

1st new

This is topic ID = 1731 Current time is 07:57	Page: 1 2
Nikon DSLR Forums > The Image Processing and Editing Forums > Software, techniques and tips for image publishing > Publishing images on the internet	Top
Users viewing this topic