New Site: HTML Ipsum
Published by Chris Coyier
There are a number of Lorem Ipsum sites that I like. I even have a dashboard widget for generating it. But none of them does what I REALLY want, which is to give me the Latin text already in HTML tags. So, I built one.
Clicking on any of the blocks automatically copies the text to your clipboard! Let me know if you have any questions/comments/suggestions.
Good for you – dude that’s dope. Thanks for the resource!
Great resource Chris! I will defiantly be using the ‘Kitchen Sink’ code in my future developments, thanks!
Nice idea, was thinking about something similar a while ago. However I do need to point out it’s Latin and not Greek ;-)
Ah yes, my bad, Changed to “Latin” in the article.
He was thinking ahead to the day it’s “all Greek” to someone…
Great idea! Except it doesn’t copy to clipboard in FF. That can be done using jQuery and Flash if you want.
If it doesn’t work, then hide it, I think.. :o)
It does work in Fx and it does default to flash.
http://html-ipsum.com/js/jquery.copy.js
Oh, I see.. Well. No copy here :(
Are you Windows? Maybe that’s the issue? Let me know the details and I’ll try to do some testing.
It’s working for me. XP SP2, FF3 and no idea what flash, probably quite old.
XP Service Pack 3, MF 3
Works fine (and im loving it by the way)
Is this intense debate again or a new commenting system?
Yes,
Windows Vista Business 64 bit,
Firefox 3.0.4,
Flash 10,0,12,36.
Flash works on other sites.
I’m using Vista Ultimate SP1, FF3. And when I click it says ‘copied to clipboard’ but it doesn’t seem to update what is actually on the clipboard.
If I copy it works fine though.
I guess it just means we should slightly less lazy!
Thanks for the Great site Chris!
This is my experience as well. In any case I’ve added this to my default list of resources for development. Thanks for your excellent work.
Same problem… not that it’s a big deal. Vista 64bit, FF3, Flash 10.
Great site, but it doesn’t copy to my clipboard either, I’m using FF on Windows Vista 64bit (yeah I know vista sucks but it’s all I have :-( )
BTW Thanks for sharing it with us!
Chris, thanks for this! I too was getting a bit tired of ‘viewing source’ at lorem2, my “previous” favorite ipsum-site.
Also, you need to know your underwear is showing.
and no, i didn’t put your underwear up at flickr.
:) Thanks again!
I refuse to care about that setting the background color stuff. Every browser defaults to white. If you are one of the 0.001% of people who would ever change that, doesn’t that mean that you WANT to see that color? More likely, you’ve changed it just so you can find sites who haven’t set a color so you can shake your fist at the designer.
Good for you, I think it’s stupid too.
These people probably are quite annoying. Please also respect the other 0.001 % who use inverted high contrast color schemes for good reasons (mostly bad eye sight). BTW, the problem is not the missing background color. It’s setting the foreground without setting the background. html-ispum.com does not set colors at all which is indeed preferred by many.
And thanks for this great site :-)
<!--Commenting Style-->.humor {sarcasm: 100%; wit: dimmed; humility: auto;}
Chris, Tim, RatTus– you’re kidding, right? Seriously, you not really sitting there incensed are you? If so, I’m sorry. No, a really heartfelt sorry.
<div class="humor">
It was certainly not my intent to offend the logic of any of you. I was simply commenting on 1) How great his new site offering would be, and 2) how even the simplest rules get by the masters.
But now is it appears I’ve uncovered an even bigger chasm– between those with a penchant for learning, and the others that seem to know it all.
I as well now seem to have two additional sensei. I’m guessing my comment bore some fruit after all– instead of being simply boring and an unintentional-aggression-catalyst.
<div>
Best regards to all. And thanks for the two new feeds Tim/Rat
Michael
I didn’t mean to sound pissy about it, but it’s like the third time this week someone has mentioned that to me and linked me to Zeldman’s article. I just feel like people haven’t really thought it through and are just regurgitating Zeldman as gospel. He’s a web hero, for sure, but this underwear business is inane to me.
i prefer boxer briefs.
but i have to agree with you, if you’re going to be playing with browser background colors, then you’re probably making a whole bunch of browser setting changes (font, size, bg color, font color) that many just don’t care about.
and thanks for this website, it makes life easier. =) kudos dude!
What exactly is the point behind it? I’ve read Zeldman’s post but it still makes absolutely no sense to me. I’m in agreement with Chris on this one.
That is really cool. Maybe you could make it user based…
Thanks for doing this, it’s a real timesaver
Interesting! Very nice and nifty jQuery script to make it work :)
Brilliant.
Would be good if the copied to clipboard message chased the mouse, for when I click on a box below the fold…
Brilliant.
I fixed that up so now the “Copied to Clipboard!” message does come down and is visible no matter where you are.
I’ve just spent the last 10 minutes adding in to some Lipsum! Wont have to do it again thanks to you! Cheers :D
That’s great!.. :)..
Great looking site Chris. Thanks for putting it together. BTW, I’m on Windows with FF3 and no copy for me either. The message pops up and notifies me that the text has been copied, but it doesn’t actually copy it.
Here’s what I’ve been using, mindreader. There are a couple additional elements that are important to me. First, It includes H1, H2, and H3 headers. Along with strong and p, I also have em, a, br, hr, and code.
Importantly, too, the first sentence of the blockquote does not have and opening and closing p tag, which adds a tricky element when creating the CSS.
<h1>H1 Header</h1>
<h2>H2 Subhead</h2>
<h3>H3 Subhead</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti.</p>
<blockquote>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci. Aenean dignissim pellentesque felis.
<p>Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.</p>
<p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.</p></blockquote>
<p><strong>Phasellus ultrices</strong> nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.</p>
<ul>
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
<li>Aliquam tincidunt mauris eu risus.</li>
<li>Vestibulum auctor dapibus neque.</li>
<li>Nunc dignissim risus id metus.</li>
<li>Cras ornare tristique elit.</li>
</ul>
<hr />
<p><em>Phasellus ultrices</em> nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.</p>
<ol>
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
<li>Aliquam tincidunt mauris eu risus.</li>
<li>Vestibulum auctor dapibus neque.</li>
</ol>
<p><a href="">Pellentesque fermentum dolor.</a> Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.<br />
Sed adipiscing ornare risus. Morbi est est, blandit sit amet, sagittis vel, euismod vel, velit. Pellentesque egestas sem. Suspendisse commodo ullamcorper magna.</p>
<code>Morbi vitae ante. Vivamus ultrices luctus nunc. Suspendisse et dolor. Etiam dignissim. Proin malesuada adipiscing lacus. Donec metus. Curabitur gravida.</code>
That’s pretty nice, thanks for sharing. Originally I had a blockquote without paragraph tags as well, but someone pointed out that that is not valid. I didn’t want to encourage anything that wasn’t valid code. But… if you are using a CMS like WordPress, it totally does that with multi-paragraph blockquotes (where the first paragraph doesn’t get paragraph tags but the rest do).
Feel free to steal it if any of it is useful, by the way. Which may go without saying. But I said it anyway.
Thanks Chris, this is hawt! I used to get annoyed doing the greek text, but you make it so easy. Got some good response from a tweet I posted yesterday about your site. Lots of peeps area pretty happy about it. Nice work, thanks again.
Über sexy, really loved it. Bookmarked.
That’s a great tool, great time saver!
Thanks a lot Chris!
I really like the ease of use. You just click on the paragraph and the content is automatically copied. No extra keys to press. Really impressed!
Great ill be using it alot, Reccomendation: add a few paragraphs with no html…for PSD designs, then i dont have to go to any other site or delete the html tags :)
Maybe make the site with 2 tabs, html version, non-html version. Although the sites name IS HTML Ipsum…
I’m using Safari 3.2 on Mac Leopard, and I also tried it with Firefox v3 on mac. The copy to clipboard does NOT work for me.
This is fantastic! Thanks!
I’m trying to figure out what the magic combos are that are making the copy function not work. All my testing so far is positive:
Operating System: OS X 10.5.5
Browser: Firefox 3, Safari 4, Opera 9.61
Flash Version: 9.0
Outcome: All work
-=-=-=-=-
Operating System: Windows XP (SP 2)
Browser: IE 7
Flash Version: 10
Outcome: Works
-=-=-=-=-
If anyone else wants to chime in, all these variables would be nice to have.
O/S: Ubuntu Hardy Heron 8.04 (GNOME),
Browser: Firefox 3.0.4,
Flash 9.0 r124,
Outcome: Works great!
O/S: Windows Vista Home Premium,
Browsers: Firefox 3.0.4, Safari 3.1.2, IE 7, IE 6 (using IETester)
Flash 9.0 r124,
Outcome: Works great!
Nice work by the way.
Keep it up.
Operating System: Windows Vista Ultimate 32-bit SP1
Browser: Firefox 3.0.4
Flash Version: 10(I think…. how do I check?)
Outcome: Doesn´t work
Hi Chris,
I don’t know if you figured out the problem yet.
Flash 10 is known to disable javascript interaction.
Please read:
http://ajaxian.com/archives/flash-10-and-the-bad-news-for-javascript-interaction
Hope it helps.
Interesting. So it’s definitely the version of Flash that is the problem. My windows install is showing version 10 though and it is working, so that is strange. This is far beyond my development reach, although if a fix is found someday I’m happy to implement it.
Congratulations, great site. It will sure come in handy. Thanks.
Great idea! And using the excellent Scrapbook addon for Firefox makes it possible to use it even offline. Thanks Chris.
Good idea Chris! :)
What do you think about providing an API?
I think it would be usefull…
Dude, very cool. Thanks for the tool, it’ll be very useful. I’m diggin’ the new WordPress comments too.
That’s excellent, thank you! I’ve wanted something like this for a while too. What a novel idea to go ahead and make it, and give it to everyone else to use! ;-)
very cool Chris, I’ve used it twice today on two projects, a non html version like max said would be nice too
Yep — keep it bookmarked I plan to release a couple of small but cool improvements to it soon!
Doesn’t work in Firefox 3 (for me anyway)
Using Windows Vista SP1
Does not work for me in:
Chrome 0.4
Firefox 3
Safari 3.1.2
Works in:
Opera 9.6
Works for Firefox 3 for me on XP Pro.
I meant Vista SP1.
I’ve made this into a TextMate Bundle.
Get it here.
All snippets have the tab-trigger ipsum→
Includes Haml-version too for you fellow Ruby folks.
Awesome. Thanks for doing that Mikkel!
Well that’s nice, but it needs a little tweaking.
And it be cool to have options.. ie. I need a list with 8 short elements.
Or give me a series of short paragraphs. etc…
Otherwise great idea.
Nice Chris, thanks for putting this one together, a huge improvement over the site I have used previously. Simple and easy to use. Looking forward to seeing what else you have planned for the future.
Nice site! It will be useful
Good idea indeed!
Just a quick bit of info: ipsum means itself in Latin. (I am taking Latin right now and just had that word.)
Lorem ipsum in general is a combination of random Latin words and random gibberish.
Very nice and very useful, as usual Chris. Keep the good work.
On an unrelated note, under the downloads section…when I try to download Photo Revealer it gives me a 404 :/
Could you please reuplad? I’m guessing the file is missing since other downloads work just fine.
Should be fixed.
And so it is. Thank you.
Updated the site with Coda Clips and TextMate bundles.
Huge thanks to Mikkel Malmberg and Toby Pitman!
Really like the Coda Clips feature. Nice touch.
o.k., Sunday morning… sitting watching football and doing some hand coding… pretty average day… then HTMLIPSUM appears in my rss reader.
I can give today a +1
LOVE the one click copy to clipboard!
Great Idea with the column layout!
Thank You!!
Well done, Chris! It’s good to see that my comment (from the last Intersting Links-post) made a breakthrough to someone more resourceful than me at the moment. Bookmarked the site and will use it further on.
Also! It would’ve been great if you could add a standard table markup as well. So boring to write new tables for each project.
For super quick table markup, this is the tool I always use:
http://www.askthecssguy.com/kotatsu/index.html
Copy function doesn’t work in Opera 9.62 on XP.
Thanks chris, ever since you started this, ive been using this site like crazy for my .PSD Designs :)
Thanks so much! This is perfect to fill into those newly developed mockups to share with clients, and I love that you have the tags there. You’ve made a lot of our lives easier. :-)
Outstanding work! I will definitely be using this going forward!
Hey Chris,
I really like this simple, yet useful tool. I’ve bookmarked this site and I will definitely be using it in my projects.
I’m curious if you’re willing to open source the code, so we can build other tools with the same concept of copying to the clipboard.
I’d definitely be willing to give you some link love, if you upload it to github. Since it’s all client-side code, I guess I could just get it with a little command+U hacking but I’d rather just get your permission.
Thanks Again!
Feel free to do whatever you want with the code, short of copying it exactly and publishing it elsewhere.
Beware the clipboard thing though, lots of people are reporting that it doesn’t work (it’s a Flash problem). I’m thinking of just pulling that feature.
Okay, thanks.
FANTASTIC!
..and he does it again!!
Hey I am using firefox 3.5 on an imac running 10.5.5 and the copied to clipboard doesn’t work?
Apart from that the site is very cool.
Hey – so i just installed flash and now it works!
Don’t pull that feature its very useful – maybe just a notice that flash is needed.
Thanks for all the resources you provide. There ace.
Andy.
This is by far the most useful ipsum site i’ve seen. Thanks Chris!