Putting it all together

What is it?

Once you have embedded an image onto a page (view tutorial 1a. Embedding Images) in your website you can combine the parameters of the image to make it RESIZE, ALIGN and POPUP in a new window when clicked.

By using the engine code provided you combine the code together for multiple controlling effects.

Tutorial: Putting it all together: Image Resize, Align, and POPUP

Step 1

Step 2

Click the tab [Edit] to edit your page, locate the “Home” page as this is where we previously embedded an image.

Step 3

Find the line of text that is calling the image:

{butterfly.jpg}

Step 4

Now to make the image resize (View tutorial 1b. Resizing Images) add the code to make it 50% of the original, like this:

{butterfly.jpg,50%}

Step 5

Now to make the image align to the right (View tutorial 1c. Aligning Images) and the command right after the percentage code, like this:

{butterfly.jpg,50%,right}

Step 6

Now to make the image POPUP when it is clicked (View tutorial 1d. POPUP Images) add a coma , and add the text popup, like this:

{butterfly.jpg,50%,right,popup}

Example of Putting it all together:

As before, once you have inputted the Image code click [Save changes] and then have a look at your website’s Home page.

Please note: you will need to refresh the page of your website to view the changes.

The image will now be resized to 50% of the original, aligned to the right of the page and actively POPUP in a new window when clicked.