Please go to http://davidseah.com/projects/lzil for the most recent LZIL download! You may also leave comments there…this page is now locked.
Lazy Image Layout (LZIL) is my WordPress 1.2 plugin for formating images in my posts, using a terse syntax and automatic thumbnail sizing. It was developed to co-exist with PHP-Markdown 1.0. If you don’t have Markdown installed, you’ll need to make sure that the LZIL commands don’t have carriage returns after them.
The way I generally access my blog is through either the WP admin interface or using Dreamweaver. I upload files using Dreamweaver, and use its code editor for managing the PHP associated with the site when that is needed. Because of this, I tend not to use the upload form of WordPress. You still need to set the upload path in your WordPress options, however…LZIL uses it to determine the base location of your images.
Anyway, here are the important features:
- terse syntax:
- short: !@(imagename)
- long: !@(imagename:align_width dest_url “alt-title”)
- dest_url and “alt-title” are optional, and either can appear singly.
- popup image support.
- automatic thumbnail generation and caching on-the-fly.
- can align left, right, with “no margin” option available for full-width images.
- doesn’t use <div> tags, so will work inside of other blocks like <p>.
- attempts to provide useful error messages back to the user
To-Do List:
- Add :X (no resize) option
- Add SWF support
- Add no border support
- Rewriting using inline tables, so we can have captions (I think this is a proper use of tables in CSS, but tell me if I’m wrong)
The images below are a mixture of JPEG and GIF files.




















Hi Semih,
It looks like the output is correct (the width is specified to 132 pixels, the default). However, there is a conflict with the CSS at /themes/default/style.css that’s causing this to mess up. LZIL uses a class called “image-left”, which might be defined in the template. I think this is the cause.
I’ll upload a new version of LZIL (0.33) that changes the class names to something more lzil-specific…this might fix your problem, and future conflicts.
Loco,
Regarding markdown messing up the formatting of your site, I see the same squished thumbnail problem that Semih reported. Hmm. Maybe this is wider-spread than I thought.
The main difference in using Markdown with LZIL is where you put carriage returns in your paragraphs. This is a side effect of how Markdown crunches out whitespace.
* When using markdown, put the !@( … ) tag on its own line, followed by a carriage return, then followed by the paragraph you want the image to be aligned with.
* When NOT using Markdown, eliminate the carriage return after the !@( … ), and make sure there are no spaces between the beginning of the text and the end of the LZIL !@( … ) tag. This will avoid that funny “the top of the image deosn’t align with the top of the text” effect.
Hi!
Really great work ! I’ve just install it on WP1.5 and all works fine :)
Would it be good to make another option to the tag, for example !@(img.jpg:n132 url “Title” “Thumbnail description”), and post this description inside the thumbnails’ border with proper css?
Anyway, thanks very much and sorry for my english – it’s not my native language ;)
And there’s one thing – LZIL don’t work properly with rss feeds :(
Hi Rustam
Yes, I’d like to eventually include captions for photos, but it would require me to rewrite a portion LZIL and I haven’t had time to do it. It’s on the “todo” list. It probably will just show the title under the caption.
I don’t use RSS myself, so I’m not exactly sure what it’s supposed to do or how to support it properly. Last I checked it was generating valid RSS, but with no images inside.
Probable there is good filter : add_filter(‘the_content_rss’, ‘’,1);
will try tomorrow… may be it will works good…
hey, take a look
Warning: getimagesize(/home/virtual/site117/fst/var/www/html/blog/wp-content/paleta1.jpg): failed to open stream: Permission denied in /home/virtual/site117/fst/var/www/html/blog/wp-content/plugins/LazyImageLayout.php on line 273
klhsñhcwiohfcwvlkdfnv
LZIL: unsupported image type:
/home/virtual/site117/fst/var/www/html/blog/wp-content/paleta1.jpg
works in WP 1.5???
Latent:
It should work in 1.5.
Your error “permission denied” seems to indicate a file permission problem on your host ISP. So it looks like two things happenned:
(1) PHP can’t open the file you specified
(2) As a result, LZIL can’t do anything…it got an “empty” file as a result of the “permission denied” error.
You should double-check your file uploading and permissions setup on your web host. One way to check is to see whether you can actually see the file in a regular web browser, something like http://yoursite.com/blog/wp-content/paleta1.jpg
great!!! now works.. the permisssion of the image was 000 ;-)
now the image dont respect the next post and appear beside the next post title. i dont know how repair this…
by the way, you are one of the few people in the world of internet that help me with so many data. thanks.
sorry for my english
OK. now the fra,me of the image appears.. but the image not. just a ?. the image link is missing.
and another thing: the text aligment doesnt respect. all the text of the post ins over my template cross over it.
thanks for you help
Latente:
It’s hard to tell what’s wrong without seeing the page and its source. Your URL doesn’t seem to work (http://www.latenteblog.com/)…at least, it’s not working for me.
Dave, thanks for all teh Help. just one question more: there´s a way to put imagen of less than 132 px?? can I puta image of 80x80px??
Yes, LZIL has several built-in options for sizing (width only). Check the documentation for more info, but to make a 80 pixel wide image, you’d do this:
!@(path/to/image/mypic.jpg:L80 popimg: “my picture”)
Likewise, to put it on the right side, you’d do
!@(path/to/image/mypic.jpg:R80 popimg: “my picture”)
You can change the default size to something else by modifying the code…there are several variables defined at the top of the plugin file that you can modify easily.
Dave
Wow, this is really nice. There are only a couple of things holding me back from using it full time.
1.) It would be cool to have an option that the image(s) are centered and the text is on either side.
Example:
———————-
I love cheese, I like these cheeses:
[space]
[CENTER][IMG][IMG][IMG][/CENTER]
[space]
But that isn’t the half of it…
———————-
2.) An option to have it so that the plugin will assume that all your thumbnails should be pop-ups.
3.) Something that doesn’t make thumbnails look linked if they don’t pop-up. I know it just goes to a [removed]; that pulls up the pop-up if need be, but some people might think that your thumbnails are broken, and never try any of them if the first few don’t “work.”
I eagerly look forward to seeing what you do with this.
-DR
Hi Digital Ruse,
Those are all great suggestions. Thanks!
(2) and (3) will have to await the next version, which I’ve been putting off due to other projects.
(1) You can have now if you have a fixed-width layout, and calculate the widths accordingly. There’s a formula in the instructions part of this entry.
If you’re comfortable rooting around in PHP, you can change some of the default behavior pretty easily yourself. The code is pretty straightforward.
Dave
Something else… is there a way to have it so that it recognizes spaces in file paths?
!@(Lost Files/img.jpg:L popimg: “My IMG”)
Gives this error:
LZIL: file not found:
/home/theruse/public_html/wp-gal//Lost
Thanks
-DR
Oh, and I did already try using or   as a temporary solution and that didn’t work either.
The only reason I found this problem is cause I am trying to avoid redundant images by combing your plugin with simple php gallery. You can e-mail me if you don’t want to banter about this in your comments section. ^_^‘v
-DR
Hey DR,
Hm, I don’t think I have space support in. I could add it in a future revision. I personally am not a big fan of spaces in filenames, so that’s why it’s not implemented. I’ll try to look into this later this week and provide some kind of private patch.
Hi Dave,
Just installed your plugin but both the thumbnail image and the popup image do not show, the image sizes are correct but appear as broken links. This is the code I inserted in the post:
!@(109.jpg popimg: “Shibuya 109”)
I made a new folder called images in the wp-content folder and that is where my uploads are directed to. I’m using WP1.5 with this plugin and Markdown plugin both activated. Any ideas as to why it’s not working?
Thanks.
Hi MrJ,
Just checked out your site, and it looks like the plugin isn’t activating…maybe you’re doing some maintenance.
A general debugging tip: When the images aren’t showing, take a look at the generated HTML source using “View Source” from the Browser’s menu. You can usually figure out what the problem that way…usually it’s a path problem. I can see on your site now that your stylesheet paths are having problems.
I’m not sure why LZIL isn’t working…possibly, you have a conflicting plugin, or you have modified your index.php base template in such a way that it’s not properly invoking plugins.
Dave,
as I was working on that problem my site suddenly went haywire and shut me out. I had to do a re-install and am in the motion of activating the plugin again. I realised that I had downloaded v0.34 when I was having all the problems, just found the newer v0.35 (did you know that you have both of them on your site?)
Anyway, will have another shot at it and will let you know how it goes. I compared our source codes before to see where I might of gone wrong and did see notice one difference in the file path. Hopefully all will go well this time…
Thanks for your prompt reply.
Dave,
All systems are go! It’s working now, I had the image path directory URI wrong (slaps forehead*). This plugin is the answer to my image prayers- thanks very much!
Awesome! Glad to be of service, and I corrected the 0.34 link. I should lock the comments on this post so people start going to the newer one. Please go to http://davidseah.com/projects/lzil to leave comments.