HTML codes to display photo uploaded via Blogger.com's new updated post editor
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCJwCBIofNXsh1hBw_NUfS84fS_oCKYC0rF_6KYWnpqwpzgUBoObD1vd0xXX3D1QmH0hQaNhVRhR6qmP9CL6V1l2DyZJnZ2p00yD8zGPsE_Mxr5GaHnlGi4zl1XUQ4hBueBdza3NgRoJA/s1600/Kenwood+induction+cooker.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCJwCBIofNXsh1hBw_NUfS84fS_oCKYC0rF_6KYWnpqwpzgUBoObD1vd0xXX3D1QmH0hQaNhVRhR6qmP9CL6V1l2DyZJnZ2p00yD8zGPsE_Mxr5GaHnlGi4zl1XUQ4hBueBdza3NgRoJA/s320/Kenwood+induction+cooker.JPG" /></a></div>
<div id="seolinx-tooltip" style="border: 1px solid rgb(0, 0, 0); display: none; margin: 0pt; opacity: 0.9; padding: 0pt; position: absolute; width: auto; z-index: 99999;">
<table style="border-collapse: separate; border: 0pt none; margin: 0pt; padding: 0pt; width: auto;"><tbody>
<tr><td id="seolinx-table" style="border: 0pt none; font-family: Tahoma; font-size: 11px; font-weight: bold; margin: 1px; padding: 0pt;"><div style="margin: 0pt; overflow: auto; padding: 0pt; width: auto;">
<table id="seolinx-paramtable" style="border-collapse: separate; border: 1px solid gray; margin: 0pt;"><tbody>
<tr><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://toolbarqueries.google.com/favicon.ico" style="vertical-align: middle;" width="12px" /> PR: <a href="javascript:{}" seolinx-param-index="0" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Google pagerank">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.google.com/favicon.ico" style="vertical-align: middle;" width="12px" /> I: <a href="javascript:{}" seolinx-param-index="1" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Google index">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.google.com/favicon.ico" style="vertical-align: middle;" width="12px" /> L: <a href="javascript:{}" seolinx-param-index="2" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Google links">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://siteexplorer.search.yahoo.com/favicon.ico" style="vertical-align: middle;" width="12px" /> LD: <a href="javascript:{}" seolinx-param-index="12" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Yahoo linkdomain">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.bing.com/favicon.ico" style="vertical-align: middle;" width="12px" /> I: <a href="javascript:{}" seolinx-param-index="20" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Bing index">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><a href="javascript:{}" seolinx-param-index="40" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Sitemap.xml">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.semrush.com/favicon.ico" style="vertical-align: middle;" width="12px" /> Rank: <a href="javascript:{}" seolinx-param-index="41" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="SEMRush Rank">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.semrush.com/favicon.ico" style="vertical-align: middle;" width="12px" /> Traffic: <a href="javascript:{}" seolinx-param-index="42" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="SEMRush SE Traffic">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.semrush.com/favicon.ico" style="vertical-align: middle;" width="12px" /> Price: <a href="javascript:{}" seolinx-param-index="43" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="SEMRush SE Traffic price">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://siteanalytics.compete.com/favicon.ico" style="vertical-align: middle;" width="12px" /> C: <a href="javascript:{}" seolinx-param-index="108" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Compete Rank">wait...</a></td></tr>
</tbody></table>
</div>
</td><td id="seolinx-tooltip-close" style="border: 0pt none; cursor: pointer; margin: 0pt; padding: 1px; vertical-align: middle; width: auto;" title="close"><img src="chrome://seoquake/content/skin/close.gif" /></td></tr>
</tbody></table>
</div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCJwCBIofNXsh1hBw_NUfS84fS_oCKYC0rF_6KYWnpqwpzgUBoObD1vd0xXX3D1QmH0hQaNhVRhR6qmP9CL6V1l2DyZJnZ2p00yD8zGPsE_Mxr5GaHnlGi4zl1XUQ4hBueBdza3NgRoJA/s1600/Kenwood+induction+cooker.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCJwCBIofNXsh1hBw_NUfS84fS_oCKYC0rF_6KYWnpqwpzgUBoObD1vd0xXX3D1QmH0hQaNhVRhR6qmP9CL6V1l2DyZJnZ2p00yD8zGPsE_Mxr5GaHnlGi4zl1XUQ4hBueBdza3NgRoJA/s320/Kenwood+induction+cooker.JPG" /></a></div>
<div id="seolinx-tooltip" style="border: 1px solid rgb(0, 0, 0); display: none; margin: 0pt; opacity: 0.9; padding: 0pt; position: absolute; width: auto; z-index: 99999;">
<table style="border-collapse: separate; border: 0pt none; margin: 0pt; padding: 0pt; width: auto;"><tbody>
<tr><td id="seolinx-table" style="border: 0pt none; font-family: Tahoma; font-size: 11px; font-weight: bold; margin: 1px; padding: 0pt;"><div style="margin: 0pt; overflow: auto; padding: 0pt; width: auto;">
<table id="seolinx-paramtable" style="border-collapse: separate; border: 1px solid gray; margin: 0pt;"><tbody>
<tr><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://toolbarqueries.google.com/favicon.ico" style="vertical-align: middle;" width="12px" /> PR: <a href="javascript:{}" seolinx-param-index="0" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Google pagerank">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.google.com/favicon.ico" style="vertical-align: middle;" width="12px" /> I: <a href="javascript:{}" seolinx-param-index="1" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Google index">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.google.com/favicon.ico" style="vertical-align: middle;" width="12px" /> L: <a href="javascript:{}" seolinx-param-index="2" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Google links">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://siteexplorer.search.yahoo.com/favicon.ico" style="vertical-align: middle;" width="12px" /> LD: <a href="javascript:{}" seolinx-param-index="12" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Yahoo linkdomain">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.bing.com/favicon.ico" style="vertical-align: middle;" width="12px" /> I: <a href="javascript:{}" seolinx-param-index="20" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Bing index">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><a href="javascript:{}" seolinx-param-index="40" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Sitemap.xml">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.semrush.com/favicon.ico" style="vertical-align: middle;" width="12px" /> Rank: <a href="javascript:{}" seolinx-param-index="41" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="SEMRush Rank">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.semrush.com/favicon.ico" style="vertical-align: middle;" width="12px" /> Traffic: <a href="javascript:{}" seolinx-param-index="42" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="SEMRush SE Traffic">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://www.semrush.com/favicon.ico" style="vertical-align: middle;" width="12px" /> Price: <a href="javascript:{}" seolinx-param-index="43" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="SEMRush SE Traffic price">wait...</a></td><td style="background: none repeat scroll 0% 0% rgb(240, 240, 240); border: 1px solid gray; color: darkgreen; font-family: Tahoma; font-size: 7pt; font-weight: bold; padding: 2px; white-space: nowrap;"><img height="12px" src="http://siteanalytics.compete.com/favicon.ico" style="vertical-align: middle;" width="12px" /> C: <a href="javascript:{}" seolinx-param-index="108" seolinx-type="param" style="color: blue; font-family: Tahoma; font-size: 7pt; font-weight: bold; text-decoration: underline;" title="Compete Rank">wait...</a></td></tr>
</tbody></table>
</div>
</td><td id="seolinx-tooltip-close" style="border: 0pt none; cursor: pointer; margin: 0pt; padding: 1px; vertical-align: middle; width: auto;" title="close"><img src="chrome://seoquake/content/skin/close.gif" /></td></tr>
</tbody></table>
</div>
And below is exactly the same photo, but displayed using only a small portion of the code, plus the HTML codes in a scroll box below the photo too:
HTML codes to display the photo above
Try clicking on the photo and see what happen:<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCJwCBIofNXsh1hBw_NUfS84fS_oCKYC0rF_6KYWnpqwpzgUBoObD1vd0xXX3D1QmH0hQaNhVRhR6qmP9CL6V1l2DyZJnZ2p00yD8zGPsE_Mxr5GaHnlGi4zl1XUQ4hBueBdza3NgRoJA/s1600/Kenwood+induction+cooker.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCJwCBIofNXsh1hBw_NUfS84fS_oCKYC0rF_6KYWnpqwpzgUBoObD1vd0xXX3D1QmH0hQaNhVRhR6qmP9CL6V1l2DyZJnZ2p00yD8zGPsE_Mxr5GaHnlGi4zl1XUQ4hBueBdza3NgRoJA/s320/Kenwood+induction+cooker.JPG" /></a></div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCJwCBIofNXsh1hBw_NUfS84fS_oCKYC0rF_6KYWnpqwpzgUBoObD1vd0xXX3D1QmH0hQaNhVRhR6qmP9CL6V1l2DyZJnZ2p00yD8zGPsE_Mxr5GaHnlGi4zl1XUQ4hBueBdza3NgRoJA/s1600/Kenwood+induction+cooker.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCJwCBIofNXsh1hBw_NUfS84fS_oCKYC0rF_6KYWnpqwpzgUBoObD1vd0xXX3D1QmH0hQaNhVRhR6qmP9CL6V1l2DyZJnZ2p00yD8zGPsE_Mxr5GaHnlGi4zl1XUQ4hBueBdza3NgRoJA/s320/Kenwood+induction+cooker.JPG" /></a></div>
And still the same photo, but see what happen when you click on the photo:
No comments:
Post a Comment