Skip to main content

Ok, I know many users already know how to format their diaries and add images etc., but for every one else this is a guide to making your diary look like the pros.  First thing to remember is that nothing here is really all that complicated, don't think you can't figure out how to add a picture or link, trust me, you can do it.  Second there are auto formatting tricks referenced in the FAQ that are currently not working on DK4 but (I believe) will be in the future.  I will update the diary at that time but have excluded them for now.  Last, there are other ways to format your diaries, these tips are just those I thought were easy and essential.

Still need help?  Have some suggestions? Please leave feel free to leave a comment.  

Thanks and enjoy!

Bolding Text

  1. One way to bold text is to select it:
  2. Then click the 'Bold' button below:
  3. Daily Kos encloses the text with the <strong> tags:
  4. And now the text is bold when you publish:

Another way is to manually enclose the text with the tags <b> and </b> or <strong> and </strong>:

LaFeminista is one of the <b>boldest</b> writers ever, but nyceve is one of the <strong>strongest</strong>.

Would look like:

LaFeminista is one of the boldest writers ever, but nyceve is one of the strongest.

Italicizing Text

  1. One way to italicize text is to select it:
  2. Then click the "Italic" button below:
  3. Daily Kos has encloses the text with the <em> tags:
  4. And now the text is italicized when you publish:

Another way is to manually enclose the text with the tags <i> and </i> or <em> and </em>:

I would just like to <em>emphasize</em> bobswern’s <i>exceptional</i> writing.

Would look like:

I would just like to emphasize bobswern’s exceptional writing.

Underlining Text

To underline text, manually enclose it with the tags <u> and </u>:

I like <u>both</u> Meteor Blades <u>and</u> Armando.

Would look like:

I like both Meteor Blades and Armando.

Striking Out Text

To strikeout text, manually enclose it with the tags <s> and </s>:

What? I’ve <s>never</s> made a grammatical or spelling eror in mine life!

Would look like:

What? I’ve never made a grammatical or spelling eror in mine life!

Subscript Text

To make subscript text, manually enclose it with the tags <sub> and </sub>:

This <sub>text</sub> is subpar to TomP's.

Would look like:

This text is subpar to TomP's.

Superscript Text

To superscript text, manually enclose it with the tags <sup> and </sup>:

This text isn’t as super as <sup>Frankenoid</sup>

Would look like:

This text isn’t as super as Frankenoid

Smaller Text

To make text smaller, manually enclose it with the tags <small> and </small>:

<small>Mark Sumner inspires me.</small>

Would look like:

Mark Sumner inspires me.

Headers

There are two distinct header styles that can be used by manually enclosing the text with the tags <h1> and </h1> or <h2> and <h2>:

<h1>Bob Johnson’s Dairies</h1>

Would look like:

Bob Johnson’s Dairies

And:

<h2>Bob Johnson's Diaries</h2>

Would look like:

Bob Johnson's Diaries



Blockquotes

  1. One way to place text in blockquotes is to select it:
  2. Then click the 'Blockquote' button below:
  3. Daily Kos encloses the text with the <blockquote> tags:
  4. And now the text is placed in blockquotes when you publish:

Another way is to manually enclose the text with the tags <blockquote> and </blockquote>:

Glenn Greenwald writes:

<blockquote>
On Friday, State Department spokesman P.J. Crowley denounced the conditions of Bradley Manning's detention as "ridiculous, counterproductive and stupid," forcing President Obama to address those comments in a Press Conference and defend the treatment of Manning. Today, CNN reports, Crowley has "abruptly resigned" under "pressure from White House officials because of controversial comments he made last week about the Bradley Manning case."
</blockquote>

Would look like:

Glenn Greenwald writes:

On Friday, State Department spokesmanP.J. Crowley denounced the conditions of Bradley Manning's detention as "ridiculous, counterproductive and stupid," forcing President Obama to address those comments in a Press Conference and defend the treatment of Manning. Today, CNN reports, Crowley has "abruptly resigned" under "pressure from White House officials because of controversial comments he made last week about the Bradley Manning case."

Lists

There are two types of list, ordered (i.e. numbered) and unordered.

Ordered lists must begin and end with the <ol> and </ol> tags, with each item you want listed enclosed with the tags <li> and </li>:

Today’s Plan
<ol>
<li>Wake up</li>
<li>Turn on computer</li>
<li>Write world changing Daily Kos diary</li>
<li>Refresh diary every 10 seconds to see who’s recommended it</li>
<li>Passive-aggressively  express disgust with those who haven’t</li>
<li>Take blood pressure medication</li>
<li>Repeat until ER visit</li>
</ol>

Would look like:
Today’s Plan
  1. Wake up
  2. Turn on computer
  3. Write world changing Daily Kos diary
  4. Refresh diary every 10 seconds to see who’s recommended it
  5. Passive-aggressively  express disgust with those who haven’t
  6. Take blood pressure medication
  7. Repeat until ER visit


Unordered lists must being and end with the <ul> and </ul> tags, with each item you want listed enclosed with the tags <li> and </li>:
3 of My Favorite Brooklynbadboy Diaries
<ul>
<li>Manning chain of command a "comedy of errors"</li>
<li>Austerity for whom?</li>
<li>In praise of my postman and curses on Bloomberg</li>
</ul>

Would look like:
3 of My Favorite Brooklynbadboy Diaries

Linking

There are two ways to link to an another website, one is to highlight the text you wish to turn into a hyperlink and click the ‘Link’ button below:

  1. One way to link to a website is to select the text you want to turn into a link:
  2. Then click the 'Link' button below:
  3. Now paste or type the web address:
  4. Daily Kos encloses the text with the <a> tags:
  5. And now you have a link when the diary publishes:

Another way is to manually enclose the text with the <a> and </a> tags with the ‘href’ attribute set to the web address:

<a href="http://www.dailykos.com/... >Remember when openthread gained sentience?</a>

Would look like:

Remember when openthread gained sentience?

Adding Images

First you must upload the image to an approved hosting service:

http://www.photobucket.com
http://www.imageshack.us
http://flickr.com
http://smugmug.com
http://webshots.com
http://picturetrail.com
http://mac.com
http://allyoucanupload.com

Each image will have a direct link address, copy it.  

Now add the <img> tag with the ‘src’ attribute set to the direct link address of the image:

<img src="http://i1036.photobucket.com/albums/a441/egray2010/baby-pandas-7.jpg">

Would look like:

If an image is too large, you can constrain the width by adding the ‘width’ attribute set to the number of pixels wide you want the image:

<img src="http://i1036.photobucket.com/albums/a441/egray2010/baby-pandas-7.jpg" width="300">

Would look like:

To align text either to the right or left of the image add the ‘align’ attribute set to the direction of the text you want:

<img src="http://i1036.photobucket.com/albums/a441/egray2010/giant-panda.jpg" width="300" align="left">How do I know Republicans hate this panda?  Because it's not a billionaire.

Would look like:

How do I know Republicans hate this panda?  Because it's not a billionaire.
























Or:

<img src="http://i1036.photobucket.com/albums/a441/egray2010/giant-panda.jpg" width="300" align="right">Sarah Palin would enjoy shooting this panda from a plane.

Would look like:

Sarah Palin would enjoy shooting this panda from a plane.












Embedding Videos

There many outlets to get videos from, I’m going to concentrate on three in hopes it helps you figure out how to embed from other sources as the principles are generally the same.  Now the embed from some sources isn't going to work, you'll have to just link to the video instead.

Youtube is extremely easy, just find your video, copy the embed code and paste it into your diary:

Copied code:

<iframe title="YouTube video player" width="640" height="390" src="http://www.youtube.com/embed/hK3hq3aPl8k" frameborder="0" allowfullscreen></iframe>

Would look like:

Comedy Central is also easy, hover the mouse over the video, click the ‘Embed’ link and paste it into your diary:

Copied code:

<div style="background-color:#000000;width:520px;"><div style="padding:4px;"><embed src="http://media.mtvnservices.com/mgid:cms:video:colbertnation.com:377119" width="512" height="288" type="application/x-shockwave-flash" allowFullScreen="true" allowScriptAccess="always" base="." flashVars=""></embed></div></div>

Would look like:



For MSNBC, like Comedy Central, hover the mouse over the video, click ‘clip & share’ and then the ‘Embed’ button, now paste it into your diary:

Copied code:

<object width="420" height="245" id="msnbc4e1461" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/... name="movie" value="http://www.msnbc.msn.com/... /><param name="FlashVars" value="launch=41259523&width=420&height=245" /><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="true" /><param name="wmode" value="transparent" /><embed name="msnbc4e1461" src="http://www.msnbc.msn.com/id/32545640" width="420" height="245" FlashVars="launch=41259523&width=420&height=245" allowscriptaccess="always" allowFullScreen="true" wmode="transparent" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/... style="font-size:11px; font-family:Arial, Helvetica, sans-serif; color: #999; margin-top: 5px; background: transparent; text-align: center; width: 420px;">Visit msnbc.com for <a style="text-decoration:none !important; border-bottom: 1px dotted #999 !important; font-weight:normal !important; height: 13px; color:#5799DB !important;" href="http://www.msnbc.msn.com">breaking news</a>, <a href="http://www.msnbc.msn.com/... style="text-decoration:none !important; border-bottom: 1px dotted #999 !important; font-weight:normal !important; height: 13px; color:#5799DB !important;">world news</a>, and <a href="http://www.msnbc.msn.com/... style="text-decoration:none !important; border-bottom: 1px dotted #999 !important; font-weight:normal !important; height: 13px; color:#5799DB !important;">news about the economy</a></p>

Would look like:

Visit msnbc.com for breaking news, world news, and news about the economy

Now some copied code will contain images that aren’t from an approved image hosts, but you can delete everything but the <embed> tags and the video should embed just fine then.

Embedding Documents

SuperBowlIXX has a great diary on using Scribd (kind of like the Youtube of documents) where you can upload pdfs, spreadsheets, and other documents or find ones that are already posted and embed them in your diary.  Read the diary  for more help, but in summary:

Find the document you are looking for on Scribd.  Click on the Share button when you've found it.  Then, copy and paste the following code into your diary or comment:
<embed src="http://d1.scribdassets.com/ScribdViewer.swf?document_id=INSERT FLASHVARS NUMBER WITH ACCESS KEY HERE" quality="high" pluginspage="http://www.macromedia.com/... play="true" loop="true" scale="showall" wmode="opaque" devicefont="false" name="INSERT OBJECT NUMBER HERE" menu="true" allowfullscreen="true" allowscriptaccess="always" type="application/x-shockwave-flash" align="middle" height="500" width="600"></embed>

In the original HTML code from Scribd, find the FlashVars number and its access key (which is the string of numbers and letters after "document_id", at the bottom of the HTML); and the Object number (usually a 15-digit number found in the middle of the HTML after "doc_").  Copy and paste these strings into their appropriate places in the HTML code above.

Tables

Tables are great way to organize infomration or arrange images.  There's a great example of using tables in jotter's High Impact Diaries series, and it's easy to think of a table like spreadsheet with rows and columns.  First every table must begin with a <table> tag and end with </table>.  Second, there are table rows, which begin with <tr> and end with </tr>, and between rows are table cells, which begin with <td> and end with </td>.  Third, tables and their cells can have several optional attributes such as borders, padding, text alignment, specific widths, and background colors.  For an example I'm going to reproduce the top five high impact diaries from March 13th, 2011 except I've changed the text alignments of the author column so you can see the difference (left and middle are defaults, I also constricted the width slightly):

<table cellspacing="0" cellpadding="2" border="1" width="600">
<tr>
<td>nrec</td>
<td>ncom</td>
<td>viewers</td>
<td>impact</td>
<td>Diary</td>
<td>Author</td>
<td>EDT</td>
</tr>
<tr>
<td><b>525</b></td>
<td>257</td>
<td>1414</td>
<td>5.57</td>
<td><a href="http://dailykos.com/... >Another dead freedom fighter in Libya. This one was family.</a></td>
<td align="right"><a href="http://www.dailykos.com/... >Meteor Blades</a></td>
<td>15:25</td>
</tr>
<tr>
<td><b>472</b></td>
<td>168</td>
<td>2424</td>
<td>5.00</td>
<td><a href="http://dailykos.com/... >Wisconsin farmer on fire!  Awesome video.  UPDATEx2</a></td>
<td valign="top"><a href="http://www.dailykos.com/... >strobusguy</a></td>
<td>11:00</td>
</tr>
<tr>
<td><b>364</b></td>
<td>262</td>
<td>2096</td>
<td>3.97</td>
<td><a href="http://dailykos.com/... >Anonymous To Announce "Operation 'Empire State Rebellion.'" Demands Bernanke's Ouster.</a></td>
<td valign="bottom"><a href="http://www.dailykos.com/... >bobswern</a></td>
<td>06:57</td>
</tr>
<tr>
<td><b>288</b></td>
<td>94</td>
<td>2230</td>
<td>3.08</td>
<td><a href="http://dailykos.com/... >Does anyone else notice a pattern?</a></td>
<td align="center"><a href="http://www.dailykos.com/... >fiver</a></td>
<td>12:48</td>
</tr>
<tr>
<td><b>252</b></td>
<td>82</td>
<td>1304</td>
<td>2.66</td>
<td><a href="http://dailykos.com/... >An Insider Report from Ayn Rand's Fantasyland</a></td>
<td><a href="http://www.dailykos.com/... >Black Brant</a></td>
<td>16:56</td>
</tr>
</table>

Would look like:

Ok, that's everything you need to diary like a pro...except adding captions which is tedious, for help on that check out The Elements of Style: Tips, Tricks and Regrouping News by ePluribus Media

Originally posted to Watership Down on Wed Mar 16, 2011 at 06:40 PM PDT.

Also republished by J Town, WeeklyBUG, Global Expats, Emerging Technology and Activism, Progressive Friends of the Library Newsletter, KosBusters!, Meta Groupies, Money and Public Purpose, Welcome New Users, New Diarists, Systems Thinking, and Cranky Users.

EMAIL TO A FRIEND X
Your Email has been sent.
You must add at least one tag to this diary before publishing it.

Add keywords that describe this diary. Separate multiple keywords with commas.
Tagging tips - Search For Tags - Browse For Tags

?

More Tagging tips:

A tag is a way to search for this diary. If someone is searching for "Barack Obama," is this a diary they'd be trying to find?

Use a person's full name, without any title. Senator Obama may become President Obama, and Michelle Obama might run for office.

If your diary covers an election or elected official, use election tags, which are generally the state abbreviation followed by the office. CA-01 is the first district House seat. CA-Sen covers both senate races. NY-GOV covers the New York governor's race.

Tags do not compound: that is, "education reform" is a completely different tag from "education". A tag like "reform" alone is probably not meaningful.

Consider if one or more of these tags fits your diary: Civil Rights, Community, Congress, Culture, Economy, Education, Elections, Energy, Environment, Health Care, International, Labor, Law, Media, Meta, National Security, Science, Transportation, or White House. If your diary is specific to a state, consider adding the state (California, Texas, etc). Keep in mind, though, that there are many wonderful and important diaries that don't fit in any of these tags. Don't worry if yours doesn't.

You can add a private note to this diary when hotlisting it:
Are you sure you want to remove this diary from your hotlist?
Are you sure you want to remove your recommendation? You can only recommend a diary once, so you will not be able to re-recommend it afterwards.
Rescue this diary, and add a note:
Are you sure you want to remove this diary from Rescue?
Choose where to republish this diary. The diary will be added to the queue for that group. Publish it from the queue to make it appear.

You must be a member of a group to use this feature.

Add a quick update to your diary without changing the diary itself:
Are you sure you want to remove this diary?
(The diary will be removed from the site and returned to your drafts for further editing.)
(The diary will be removed.)
Are you sure you want to save these changes to the published diary?

Comment Preferences

Meteor Blades, Sharoney, a gilas girl, Kimberley, Renee, Julia Grey, Tookish, JekyllnHyde, Angie in WA State, tmo, Bill in Portland Maine, fcvaguy, jazzmaniac, jotter, hester, slinkerwink, deben, Rita in DC, Adam B, Detlef, TrueBlueMajority, saraswati, Susan Gardner, Bob Love, DebtorsPrison, tommurphy, littlesky, Coldblue Steele, musicalhair, LynChi, Andrew C White, OLinda, dsb, free speech zone, recentdemocrat, elfling, frisco, dash888, expatjourno, FOYI, Creosote, rasbobbo, Gustogirl, TheMomCat, bronte17, Zinman, 88kathy, conchita, srkp23, ellefarr, Agathena, CalNM, Pithy Cherub, Stumptown Dave, Frederick Clarkson, Ignacio Magaloni, poe, Terre, fumie, dylanfan, sidnora, Eddie C, wader, Serendipity, asterlil, psnyder, Dallasdoc, tepster, plan9pub, figbash, virginislandsguy, ranger995, MA Liberal, roseeriter, potatohead, Steven Payne, TX Scotia, hazzcon, under the bodhi tree, bsegel, riverlover, Oaktown Girl, FlyingToaster, sarvanan17, parryander, KayCeSF, bablhous, Toddlerbob, eztempo, Limelite, Julie Gulden, davidincleveland, Desert Rose, bloomer 101, BadgerGirl, 3goldens, CTPatriot, Independent Musings, sc kitty, Alice Venturi, truong son traveler, craigkg, citizenx, MT Spaces, dewtx, Kdoug, ratzo, dansk47, Pam from Calif, Sun Tzu, Sara R, GreyHawk, Sandino, kazoo of the north, Aint Supposed to Die a Natural Death, coolbreeze, Lisa Lockwood, deepsouthdoug, sillia, dsteffen, Rogneid, Casper46, the fan man, peacestpete, Ekaterin, psyched, JanF, kkjohnson, bently, begone, RiaD, Denny in Seattle, Showman, poco, buddabelly, BachFan, lonemorriscodem, Patriot Daily News Clearinghouse, edwardssl, BlueInARedState, ActivistGuy, HoundDog, Cartoon Peril, Prognosticator, koNko, kestrel9000, The Wizard, MTmofo, kck, slampros, Lefty Coaster, blueoasis, birdbrain64, global citizen, A Siegel, nonnie9999, SadieSue, plf515, boatsie, justiceputnam, ilyana, Clive all hat no horse Rodeo, Statusquomustgo, PhilW, kurious, Granny Doc, Hedwig, slksfca, OHdog, AntKat, BentLiberal, Thinking Fella, tegrat, Noor B, pgm 01, BeninSC, dotsright, Cronesense, Femlaw, ninkasi23, UU VIEW, psychodrew, linkage, yoduuuh do or do not, DvCM, Mary Mike, some other george, jeanette0605, biggus, greenchiledem, mommyof3, DWG, suejazz, nookular, eOz, FischFry, puzzled, HCKAD, jayden, bobswern, jnhobbs, millwood, OIL GUY, Librarianmom, Got a Grip, A Person, keikekaze, fb, JDWolverton, kafkananda, mconvente, JaxDem, Chacounne, MIWill, Tchrldy, Involuntary Exile, dadadata, bythesea, skohayes, lineatus, Sharon Wraight, Mr Rick, VL Baker, jamess, Lujane, royce, TokenLiberal, Seamus D, noddem, S C B, mattc129, My Spin, allie123, Quilldriver, palantir, briefer, dmhlt 66, sydneyluv, malenda, greywolfe359, wv voice of reason, madtowntj, maggiejean, emboyo, litoralis, deMemedeMedia, Scott Wooledge, Ronnagade, not a cent, dharmasyd, zephyr108, banjolele, CanyonWren, stolen water, Partisan Progressive, Ohiodem1, DefendOurConstitution, DHinIA, MKSinSA, chicago expat, sricki, Leslie in KY, digitalmuse, Ibis Exilis, Question Authority, Vetwife, Houston Gardener, Tortmaster, Dichro Gal, rebel ga, catilinus, Larsstephens, smileycreek, foufou, p gorden lippy, GreenDog, roadbear, Vacationland, LaughingPlanet, drainflake77, politik, blueyescryinintherain, leftywright, Camcallie, ColoradAnne, Polly Syllabic, Garfnobl, ribletsonthepan, JoanMar, ctlrick, gulfgal98, Lady Libertine, SoCalHobbit, Mariken, cee4, Yasuragi, rja, MsGrin, tapu dali, not4morewars, TheHalfrican, SuperBowlXX, sboucher, ban nock, vahana, myadestes, anyname, BlueJessamine, asterkitty, lexalou, beantown mom, KelleyRN2, mawazo, princesspat, Alice Olson, Ebby, cusoon, Liberal Panzer, marleycat, Engaged, soysauce, Lorikeet, grannysally, thomask, blue denim, dle2GA, Ojibwa, muddy boots, smoothnmellow, loblolly, Gabriel D, pensivelady, Wood Dragon, StateOfGrace, wide eyed lib, Democrats Ramshield, Dbug, Friendlystranger, Phil T Duck, Book of Hearts, joanbrooker, Regina in a Sears Kit House, Mentatmark, ParkRanger, zenbassoon, DawnN, Dom9000, BlueDragon, O112358, MNDem999, weatherdude, ursoklevar, Whiskey Tango Foxtrot, Williston Barrett, Siri, IndieGuy, foucaultspendulum, dance you monster, The Lone Apple, effervescent, barkingcat, JGibson, speitzer, Horace Boothroyd III, mapamp, peachcreek, carolanne, belinda ridgewood, Criticalfrimmel, Free Jazz at High Noon, geraldlaslo, BobSmith415, supercereal, Ana Thema, Karelin, JupiterSurf, notdarkyet, cassandracarolina, Dr Bud, GDbot, echo still, tinwi, Marjmar, HoosierD42, WheninRome, Heavy Mettle, nomandates, newinfluence, dear occupant, HedwigKos, Pritty Brains, Out Now, OceanDiver, drnatrl, citylights, thumbunny, kfunk937, Deleterious, oftenon, aghaus

Subscribe or Donate to support Daily Kos.

Click here for the mobile view of the site