Code tweaks reference page

  • 1
  • Question
  • Updated 10 years ago
  • Doesn't Need an Answer
I thought we could try to collect code tweak tips in here as a point of reference.
Please only reply with tested code. If you have a question or problem with code that you have added to your Synthasite please go and ask a question from here
Always use a test page to apply html first and if you can, stirp it down by running it through a notepad.
I'll start it off with some that i've found useful.
<!--

REMOVE LINK BORDER ON IMAGES - kershnee, (Official Rep),
replace <img src="resources/stopie80.png" /> with <img style="border-width:0px;" src="resources/stopie80.png" />
-->

ADDING A BORDER TO AN IMAGE - Ed - Champ
http://getsatisfaction.com/SynthaSite...
<!--<table border="0" cellspacing="0" cellpadding="5" align="center" bgcolor="# FF3366">
<tr><td><img src="FILE OR URL"></td></tr></table>

VERTICAL LINE - Emmy; (employee)
<center><div style="width:1px; height:500px; background-color: white"></div></center>
-->

ADDING ALT CONTENT FOR FLASH - Me
A way to add alternative text and images to flash objects and a link to install a flash player.
http://getsatisfaction.com/SynthaSite...
<!--
Use this code to add your flash to your site;
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="myFlashContent" width="160" height="600">
<param name="movie" value="resources/YOURFILE.swf">
<object type="application/x-shockwave-flash" data="resources/YOURFILE.swf" width="160" height="600">
<img src="resources/YOURPIC.JPG" alt="YOUR TEXT HERE">
<br>
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/do..." alt="Get Adobe Flash player">
</a></object></object>

OPEN LINKS IN ANOTHER TAB / WINDOW - kershnee, Official Rep
add target="blank" to the link code.
<a href="http://www.wikipedia.org" target="blank">Wikipedia</a>

Any more good code tips to help tweak our Synthasites would be great.
Lee.

-->
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
  • always happy

Posted 10 years ago

  • 1
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
<!-- - From Littleus, - 'corners in borders /tables'

<div style="border: 1px solid rgb(0, 0, 0); width: 860px; height: 30px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px;"></div>

-->
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hey Duke

This code credit should be given to John. =)
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
sorry - credit where credits due - -
From Littelus thread by John :)

PS feel free to add to this post if you find anything good.
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
<!-- By Peter - 'cross browser favicon'

<link rel="shortcut icon" href="http://hexham.info/resources/favicon....>

-->
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
<!-- By Peter - 'page redirect'

<meta http-equiv="refresh" content="1; url=http://hexham.info">

-->

NOTE: it is set to 1 second redirect - once added to the site builder you can no longer edit the page its on.
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
<!-- By Peter 'anchors'

(link)
<a style="text-decoration: none; color: rgb(255, 255, 255);" href="#a1">link text</a>

(anchor)
<a name="a1"></a>

-->

NOTE: the text-decortaion: none removes the underline of the link + the Color=black
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
<!-- By Me 'page background color'

<body style="background-color: #ffffff;">

-->

NOTE: add to html widget high in the page - set to white colour.
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
<!-- By Boomer 'hover CSS'

<style> a:link:hover, a:visited:hover {text-decoration: underline; color: rgb(255, 255, 255); background: rgb(0, 0, 0)} </style>

-->

NOTE: set in html widget high in page - hover link is set to white text + black backround
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
<!-- By Me - 'add a title to your links/images'

<img src="#" title="TITLE TEXT">

-->

NOTE: same thing applies when adding titles to links
Photo of Peter

Peter

  • 2569 Posts
  • 113 Reply Likes
This is not a Code tweak but a very helpful hint which allows for locating code within your page

Ref: The Duke: -'find a code (for replacement) within editor'
Ctrl+F

eg: Ctrl+F will find the first occurrence of the code string ". You can move successively through the page by repeating it.
Photo of Peter

Peter

  • 2569 Posts
  • 113 Reply Likes
retagged