Pulling images from other sections with image transform

Question

I would like to display images from various sections, in this case the home page. I am still coming to terms with Twig/Craft's criteria models and the transform makes it confusing.

{% for image in craft.entries.section('news').limit(1) %}
    {% set transformedImage = craft.imager.transformImage(image, { width: 1420, height: 550, position: image.focalPoint }) %}

    <img src="{{ image.bannerImage.first().getUrl }}" alt="" />
{% endfor %}` 

Where do you then define the image? (bannerImage is a asset field)

Answer 1

Try the following, it should do what you are after.

{#
  Generate array of entries comprised of first
  entry from each section
#}
{% set entries = [
  craft.entries.section('news').first(),
  craft.entries.section('other_section').first(),
  craft.entries.section('yet_another_section').first()
] %}

{# Loop through entry array #}
{% for entry in entries %}
  {% if entry.bannerSlider|length %}
    {% set image = entry.bannerSlider.first() %}
    {% set transformedImage = craft.imager.transformImage(image, { width: 1420, height: 550, position: image.focalPoint,  effects: { grayscale: true, gamma: 1.5}, }) %}
    <li data-transition="" data-masterspeed="500">
    <img src="{{ transformedImage.url }}"/>
  {% endif %}
{% endfor %}