The Journey: January 2021

I've been frustrated with the new blogger, unable to include photo's in the way I choose to display them, but without being a 'super coder' with lots of language skills and training, actually, being self-taught, I worked out how to put my photos in a display that works better for me, and maybe it will work for you. Below is a photo and the associated code for displaying that photo (you have to go to html view to see the code, that's the first icon on the bar above your post):

Here's that photo code again:

If you are looking for a nice random set of photo's, with little structure, or something more specific and ordered, you must first add your photo's to the page. Once loaded, I go to the html view and copy the code into notepad (it's in window accessories on most windows computers.) Once you've got the content into a text document, you can start playing. I do this outside of blogger, because if I mess up, I can go grab it again and start over. Please note, there wont always be the same code around the image code, but you will handle it the same way.

Here's that sample photo code again, and the place we begin for both methods of photo arrangement. First, find the "each image", they all start with <div Class... and end with </div> see how they are listed below:

For this first method, we will move to the first "</div>" and remove it. The following images we will remove the entire "<div class..." statement and end "</div>" all the way to the last image, where we leave the last "</div> in place

When done, your first image should have the "<div class.." statement, followed by "<a href..> and every other image should start with "<a href..." and end with </a>, except the last image, which ends with </a></div>.

The next method, uses the same first steps as the last, with a few added tags. For this, you don't need any "<div class..." statements or "</div>." Every image statement/code should begin with "<a href.." and end with "</a>." Here's what it will look like before you add any tagging:

And here's what it will look like when it's ready to be added to your page, on the HTML page. I choose to have 3 images across, you can decide which is best for your page, and make the changes to display it that way. This is very simple, you can make it far more complex, with borders, and spacing, but this basic information will get you started:

<tr><td>a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnUZZDmXnfH5gCKnaCl9Lam_fZFyEROUETHvnQ9JvWAfopARvHwK3ZL5gO-C4wEFojtNB1CweCIn50oYZS8hERrzsDl0GhkSnVVk9OizTTJBsMqPDMGPl6iFvXP6nWGsedoEy95wlS0Tw/s960/3+doll+houses.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="720" data-original-width="960" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnUZZDmXnfH5gCKnaCl9Lam_fZFyEROUETHvnQ9JvWAfopARvHwK3ZL5gO-C4wEFojtNB1CweCIn50oYZS8hERrzsDl0GhkSnVVk9OizTTJBsMqPDMGPl6iFvXP6nWGsedoEy95wlS0Tw/s320/3+doll+houses.jpg" width="320" /></a></td></tr></table>