Photos in EE Two

In the previous tutorial I covered using the photo uploading option in the control panel for adding images to your articles. Here I cover other methods of doing so. Perhaps a better term would be file uploader because you are not limited to pictures alone.

Gallery Extended

While covered somewhat in Publish From a Template, the Gallery Extended module needs more written on it alone. A major addition to any site, it now has a tab in the control panel to upload images to the gallery using the gallery preset image sizing for thumbs and medium size images. It then relates those images to your entry.

The module also has it’s own control panel. There one can edit photos much like in the gallery, with the bonus option of being able to list photos by weblog entries for editing. One of the advantages on this module is onle click uploading and resizing, making it super simple for users, even in a template outside the control panel.

One can upload any number of images wanted. This is the easiest and simplest way to add Gallery images to posts, or even make Gallery Weblogs. Available from Solspace.com.
Gallery Extended entry code in template:

{exp:gallery_extended:entries gallery_name=“Your Gallery” type=“weblog” dynamic=“on” related_id=”{entry_id}” orderby=“entry_date” sort=“asc”}
<img src=”{thumb_url}” width=”{t_width}” height=”{t_height}” alt=”{title}” />
{/exp:gallery_extended:entries}

It will repeat for the number of images uploaded for the entry.

Adding To Articles

As many extensions use code in the templates, one wants to know how to be able to include these in various places in the flow of text.

To start we need the plugin Allow EE Code . This allows adding EE tags to our entries.

{exp:allow_eecode }
{body}
{/exp:allow_eecode}

1) Use the Allow EE code in entries plugin.
2) Use Default HTML buttons to add the code with offset=“x” and limit=“1” etc right into the entry.

example button:
Tag name Image 3

Opening tag:
{exp:gallery_extended:entries gallery_name=“gallery” type=“weblog”
related_id=”{entry_id}” limit=“1” offset=“2”}
Closing tag:
<img src=”{thumb_url}” width=”{t_width}” height=”{t_height}” alt=”{title}” />
{/exp:gallery_extended:entries}

The above creates an html button in entries which adds the third photo into an entry with one click. Add any number, changing offset, and one can include photos very easily into text.

Example article using above:

<div class=“left”>
{exp:gallery_extended:entries gallery_name=“gallery” type=“weblog”
related_id=”{entry_id}” limit=“1” offset=“2”} <img src=”{thumb_url}” width=”{t_width}”
height=”{t_height}” alt=”{title}” />
{/exp:gallery_extended:entries}</div> Here I added the third image uploaded by
simply clicking on the second button above in Default HTML Buttons.

Gallery Extended + allow EEcode + HTML formatting buttons = 1 click resize and add photos anywhere in an entry.

Edit Links

Here I used the code for the gallery medium image popup, (see page bottom), and added edit links for the image - opens image in gallery editing, and the article - opens cp to edit entry.