Portfolio layout "side by side" tweak

[andybeet]

In reference to the portfolio tab.

I am looking for advice on how to display the "short description" text from above each image to the right hand size of the image. I plan to use smaller images to allow for more text

Is this an easy thing to do? And which file would i need to edit to alter this layout?

[rjzupkoii]

The code that controls the layout of the text in relation to the image is in _includes/archive-single.hml but you are going to need to do a bit of adjusting to get it to work well. Here's a tutorial that discusses one way to do it.

[andybeet]

Thanks this is very helpful.
However it is unclear (to me) as to which class(es) in the archive-single.html page i need to be targeting

[rjzupkoii]

This is the block of code with the relevant div and img tags -

      <div class="archive__item-teaser">
        <img src=
          {% if teaser contains "://" %}
            "{{ teaser }}"
          {% else %}
            "{{ teaser | prepend: "/images/" | prepend: base_path }}"
          {% endif %}
          alt="">
      </div>

However, working with the template means a mix of HTML, CSS, and Liquid to work with, so it can be a bit challenging to really customize things. Odds are archive__item-teaser is the one to focus on, and the SCSS is in _sass/layout/_archive.scss

[andybeet]

i see, thanks. This might be too much for me to do. Not sure i have the skills. Appreciate the response