Hi All<br /><br />I've not seen any examples of this, but I'm designing a site at the moment for an Antiques Dealer, which the client is going to be updating himself with Contribute and I'd like an easy way of labelling items as sold. Anybody got any ideas?<br /><br />I was thinking that the easiest thing would be if the client could apply a style to an image and for it to display as sold.<br /><br />I don't want the client to have to go and create another image with a sold sign style="vertical-align:middle" emoid="
" border="0" alt="wink.gif" /><br /><br />Simple photo gallery with sold sign overlay<br /><br />There's a couple of comments in the CSS to explain style="vertical-align:middle" emoid="" border="0" alt="smile.gif" /><br /><br />p.s. The stylesheet can be found under the <i>rel=stylesheet</i> link in the <head> part of the document, it's location is ./style.css and I've also just uploaded a .zip of the folders contents which can be downloaded here if thats easier.<!--content-->
Basically in Contribute you can't see any HTML code you just see an editable version of your web page. You can select text or image and then apply a style to them and so I was hoping that I could create a style called 'sold' and for he client to select the image and apply the 'sold' style to it. As the image hasn't got a style associated with it already the new style should apply. Fingers crossed anyway. I'm sure I can adapt what you done to suit that. I'll download your style sheet later and have a go.<br />Cheers<br />E<!--content-->
Well that shouldn't be too difficult to modify, however you may have to set the class style="vertical-align:middle" emoid="" border="0" alt="smile.gif" /><br /><br /><br /><!--c1--><div class='codetop'>CODE</div><div class='codemain'><!--ec1-->#splash {<br />Â Â Â Â width : 760px;<br />Â Â Â Â position : relative;<br />Â Â Â Â margin-bottom : 10px;<br />Â Â Â Â margin : 0 auto;<br />Â Â Â Â text-align : center;<br />}<br /><br /><br /><br />#splash .heading {<br />Â Â Â Â font-size : 1.2em;<br />Â Â Â Â color : #FFFFFF;<br />Â Â Â Â position : absolute;<br />Â Â Â Â top : 0.5em;<br />Â Â Â Â left : 0.5em;<br />Â Â Â Â margin-top : 10px;<br />Â Â Â Â margin-left : 10px;<br />Â Â Â Â line-height : 120%;<br />Â Â Â Â padding : 2px <img src="http://www.webdesignerforum.co.uk/style_emoticons/default/tease.gif" style="vertical-align:middle" emoid="8P" border="0" alt="tease.gif" />x 1px <img src="http://www.webdesignerforum.co.uk/style_emoticons/default/tease.gif" style="vertical-align:middle" emoid="8P" border="0" alt="tease.gif" />x;<br />Â Â Â Â font-weight : bold;<br />Â Â Â Â background : #9D004F;<br />}<br /><br /><br /><br />#splash .title {<br />Â Â Â Â font-size : 1.9em;<br />Â Â Â Â font-weight : bold;<br />Â Â Â Â color : #FFFFFF;<br />Â Â Â Â position : absolute;<br />Â Â Â Â bottom : 1.2em;<br />Â Â Â Â right : 0;<br />Â Â Â Â margin-bottom : <img src="http://www.webdesignerforum.co.uk/style_emoticons/default/tease.gif" style="vertical-align:middle" emoid="8P" border="0" alt="tease.gif" />x;<br />Â Â Â Â margin-right : 10px;<br />Â Â Â Â line-height : 120%;<br />Â Â Â Â padding : 2px 10px 2px 10px;<br />Â Â Â Â background : #93004A;<br />}<br /><br /><br /><br />#splash .small {<br />Â Â Â Â font-size : 1em;<br />Â Â Â Â line-height : 125%;<br />Â Â Â Â color : #fff;<br />Â Â Â Â font-weight : bold;<br />Â Â Â Â position : absolute;<br />Â Â Â Â bottom : 0;<br />Â Â Â Â right : 0;<br />Â Â Â Â margin-bottom : 15px;<br />Â Â Â Â margin-right : 10px;<br />Â Â Â Â padding : 2px 7px 2px 7px;<br />Â Â Â Â background : #3C001E;<br /><br />}<br /><br /><div id="splash"><img src=http://www.webdesignerforum.co.uk/lofiversion/index.php/"/images/splash.jpg"Â Â /><span class="heading">Latest Project:</span> <span class="title">Project Title</span> <span class="small">Project Desc.</span></div><br /></div><!--c2--></div><!--ec2--><br /><br /> <img src="http://www.webdesignerforum.co.uk/style_emoticons/default/rofl.gif" style="vertical-align:middle" emoid=":rofl:" border="0" alt="rofl.gif" /> At the emotes taking over the CSS code, those parts should read "8 p" without the space!<br /><br />Hope this is useful.. in a rush - so apologies if this isn't what you wanted at all!!<!--content-->
" border="0" alt="wink.gif" /><br /><br />Simple photo gallery with sold sign overlay<br /><br />There's a couple of comments in the CSS to explain style="vertical-align:middle" emoid="" border="0" alt="smile.gif" /><br /><br />p.s. The stylesheet can be found under the <i>rel=stylesheet</i> link in the <head> part of the document, it's location is ./style.css and I've also just uploaded a .zip of the folders contents which can be downloaded here if thats easier.<!--content-->Basically in Contribute you can't see any HTML code you just see an editable version of your web page. You can select text or image and then apply a style to them and so I was hoping that I could create a style called 'sold' and for he client to select the image and apply the 'sold' style to it. As the image hasn't got a style associated with it already the new style should apply. Fingers crossed anyway. I'm sure I can adapt what you done to suit that. I'll download your style sheet later and have a go.<br />Cheers<br />E<!--content-->
Well that shouldn't be too difficult to modify, however you may have to set the class style="vertical-align:middle" emoid="
" border="0" alt="smile.gif" /><br /><br /><br /><!--c1--><div class='codetop'>CODE</div><div class='codemain'><!--ec1-->#splash {<br />Â Â Â Â width : 760px;<br />Â Â Â Â position : relative;<br />Â Â Â Â margin-bottom : 10px;<br />Â Â Â Â margin : 0 auto;<br />Â Â Â Â text-align : center;<br />}<br /><br /><br /><br />#splash .heading {<br />Â Â Â Â font-size : 1.2em;<br />Â Â Â Â color : #FFFFFF;<br />Â Â Â Â position : absolute;<br />Â Â Â Â top : 0.5em;<br />Â Â Â Â left : 0.5em;<br />Â Â Â Â margin-top : 10px;<br />Â Â Â Â margin-left : 10px;<br />Â Â Â Â line-height : 120%;<br />Â Â Â Â padding : 2px <img src="http://www.webdesignerforum.co.uk/style_emoticons/default/tease.gif" style="vertical-align:middle" emoid="8P" border="0" alt="tease.gif" />x 1px <img src="http://www.webdesignerforum.co.uk/style_emoticons/default/tease.gif" style="vertical-align:middle" emoid="8P" border="0" alt="tease.gif" />x;<br />Â Â Â Â font-weight : bold;<br />Â Â Â Â background : #9D004F;<br />}<br /><br /><br /><br />#splash .title {<br />Â Â Â Â font-size : 1.9em;<br />Â Â Â Â font-weight : bold;<br />Â Â Â Â color : #FFFFFF;<br />Â Â Â Â position : absolute;<br />Â Â Â Â bottom : 1.2em;<br />Â Â Â Â right : 0;<br />Â Â Â Â margin-bottom : <img src="http://www.webdesignerforum.co.uk/style_emoticons/default/tease.gif" style="vertical-align:middle" emoid="8P" border="0" alt="tease.gif" />x;<br />Â Â Â Â margin-right : 10px;<br />Â Â Â Â line-height : 120%;<br />Â Â Â Â padding : 2px 10px 2px 10px;<br />Â Â Â Â background : #93004A;<br />}<br /><br /><br /><br />#splash .small {<br />Â Â Â Â font-size : 1em;<br />Â Â Â Â line-height : 125%;<br />Â Â Â Â color : #fff;<br />Â Â Â Â font-weight : bold;<br />Â Â Â Â position : absolute;<br />Â Â Â Â bottom : 0;<br />Â Â Â Â right : 0;<br />Â Â Â Â margin-bottom : 15px;<br />Â Â Â Â margin-right : 10px;<br />Â Â Â Â padding : 2px 7px 2px 7px;<br />Â Â Â Â background : #3C001E;<br /><br />}<br /><br /><div id="splash"><img src=http://www.webdesignerforum.co.uk/lofiversion/index.php/"/images/splash.jpg"Â Â /><span class="heading">Latest Project:</span> <span class="title">Project Title</span> <span class="small">Project Desc.</span></div><br /></div><!--c2--></div><!--ec2--><br /><br /> <img src="http://www.webdesignerforum.co.uk/style_emoticons/default/rofl.gif" style="vertical-align:middle" emoid=":rofl:" border="0" alt="rofl.gif" /> At the emotes taking over the CSS code, those parts should read "8 p" without the space!<br /><br />Hope this is useful.. in a rush - so apologies if this isn't what you wanted at all!!<!--content-->