What and how: step by step howto

First, note that it matters whether the data tag e.g.
<data:post.id/> is PART OF an HTML tag, inside the angle brackets (like <a
href="templatetag">), i.e. whether it's part of an attribute's value - or
whether it's outside of the HTML tag's angle brackets.


 If it's not inside the HTML tag (i.e. between the angle
brackets, the <> of the opening tag), you can just use the data tag as is - see
further example below.



 If it is inside an HTML tag, forming part of the value of
an attribute like href (meaning it's included in the "stuff" part of
href="stuff"), then you have to rewrite the tag, or rather any bit inside the
tag that says something="somethingelse including template tag" (e.g.
href="<$BlogItemURL$>").


 Example for adding to Delicious


 <a
href="http://del.icio.us/post?url=<$BlogItemPermalinkURL$>


&amp;title=<$BlogItemTitle$>"
target="_blank">Del.icio.us</a>


 becomes


 <a expr:href='"http://del.icio.us/post?url=" +
data:post.url + "&amp;title=" + data:post.title' target='_blank'>Add to
Del.icio.us</a>


 a howto, and trust me it's a lot simpler to do than to
explain!


 1. Change href= to expr:href= (the added bit is in
bold black).


 2. If it originally read href='stuff' using single quotes,
that's fine till the next step. But if it's surrounded by double quotes, e.g.
href="stuff", change those to single quotes i.e. href='stuff'. Marked bold red
in the example above too. Change any double quotes you see inside 'stuff' to
single quotes too. (Note: it might say href="stuff" target="somethingelse". You
can ignore the target="somethingelse" bit, except to change the double quotes to
single quotes (and any single quotes within the "somethingelse" to double
quotes, confusing I know!). We're mainly concerned just with the stuff within
the first set of quotes.)


 3. You now have to look at what's inside the single quotes
and separate out the old Blogger template tags. It's easiest to add a space
before or after each old template tag as appropriate, so that you have separate
blocks inside the single quotes. So


 <a expr:href='http://del.icio.us/post?url=
<$BlogItemPermalinkURL$> &title=<$BlogItemTitle$>'
target='_blank'>Del.icio.us</a>


 (don't put any spaces between the template tag and either
the starting or the ending single quote, though).


 4. Now make sure each block inside the single quotes which
is NOT a template tag has double quotes surrounding it, by inserting double
quotes in the right places. Marked bold purple below - don't forget the one just
after the opening single quote. So now it's:


 <a expr:href='"http://del.icio.us/post?url="
<$BlogItemPermalinkURL$> "&title=" <$BlogItemTitle$>'
target='_blank'>Del.icio.us</a>


5. Finally, change the old template tags to their
equivalent data tags, but WITHOUT any angle brackets round them,
and with + signs between them and the other blocks in the href. So, if, in the
bit surrounded by single quotes, the data tag is at the start, add a + sign
after it; if in the middle with other blocks, add a + sign before and after it;
and if at the end just before the closing single quote, just add a + sign before
the data tag (it's much easier to see/follow than explain!). Be careful not to
accidentally delete the existing single quotes, and there should be no spaces
between the single quotes and what they surround. It then becomes (in bold
orange):


 <a expr:href='"http://del.icio.us/post?url="
+ data:post.url + "&title="
+ data:post.title'
target='_blank'>Del.icio.us</a>


 (note there's no space between the ending data:post.title
and the closing single quote ').


 6. Rinse and repeat (i.e., do that again for all the other
attributes in the HTML tag whose value includes a template tag, such as
somethingelse="morestuff". If there's no template tag inside the morestuff you
don't have to do anything to the morestuff except change the double quotes to
single quotes and vice versa. As we did with target='_blank'.)


 (Note: yes maybe you can swap the double and single quotes
and get it to work, but as New Blogger uses them in the order/way I've stated
above, best to follow that.)





Category

10 Resources for Designers and Developers 11 Big Tech Trends You'll See in 2013 12/12/12 56 Mashable Stories 60 second Video how to keep laptop work well 70th Golden Globes ads adsense Adsense Tips Advertising AdWords Amazon Android AngryBird Apple Apple's 2012 Year in Review Apps Apps to Spice Up Your Sex Life article Barack Obama Benefits of a Job Search Community Bill Clinton Bing Bitcoins Blackberry blogging blogging secret blogging tools book Book Review; Content Marketing for Dummies Building an Email List Business News Business tips Campaign Websites Celebrities Charlie the Unicorn Chrome Content Spoiler With Simple Animation Creative Ways to Use Your Favorite Running App CSS Design Competition for Kids Digital Media Resources dnt do not track download drive traffic Dropbox Tools e-commerce ebay Effects Social Networks email enterprenour blog Entertainment Expired Domain Business Facebook facebook hacker File Management Film Firefox for Andoid Friends Sex App Gadget Games Geeks george bush george w. bush gmail golden globes Google Google + (plus) Google API Google Capture Google Trends Google Wallet Google XPhone Guest Blog Post Guest Posting Guide to Super Bowl 2013 Betting Guide To: WordPress Development With Microsoft WebMatrix gyroscopes for optical image stabilization history Hopper DVR Horde Hot Advertising Trends of 2012 How to Backup Your Skype Chat & Audio Conversations Online With Simkl html Html 5 HTML Tool hulu Hurricane Sandy instagram's new policy internet Internet Marketing Internet users iOs 6 iPad iPhone Kim Dotcom Laptop LES link building Linkedin Malware Marketing predictions 2013 marketing tips Microsoft Microsoft Surface Pro Mobile App Websites Mobile phone Mobile web Mobile web design monetizing blog money online Motorola Music NBA Negative Target Fixation New year's resolution News nostalgia Notebook Obama Online Education Online Payment Online Stores Palestinian Statehood parental apps PC Jobs Photoshop for Retina Displays Pics Pinterest Plugin porn in vine President Obama's Speech at Vigil for Newtown Victims Promoting Yourself Via Print Publisher Radio Station Review Romsey RoundCube. mail. cpanel Russian Plane Crash Video Search engine security seff identity security SEO SEO 2013 Shop For Geeky Gifts Smartphone-Enabled Website social media Social Networks Social Sites for Families Softaculous software Spam SquirrelMail superbowl 2013 Tablet Teaching Tool Tech Technology Television The Most Reputable Company in U.S. Things I Learned About Tech in 2012 tips Tools twitter latest U.S. UN Vote Universe Unlocked iPhone 5 in the U.S. upgrade script US election US president vote us presidents video Video Conferencing App for Mac Video Marketing Videos Watercooler Ways to Stay Creative While Working From Home Waze web Web design trend 2013 web traffic webtools Wedding What Is Pinterest? White House Why You Should Say No To Multitasking Wi-Fi Smart Scale windows 7 Windows 8 Windows 8 Review Windows RT Review Wirelessly Monitors Your Driving with Dash WomenWeb Wordpress Wordpress Plugin Working From Home writing web Xbox Yahoo YouTube Favorite YouTube Updates