Image Placement Guidelines

Inline Images - Horizontal

Image Min Width: 800px | Recommend .jpg Quality 60 for Photos

Responsive Display Widths: 40% from 768px to 960+px; 100% below 767px

Mayor walking on stage with flags in the background

New York City Mayor Eric Adams delivers an address on his first 100 days and the future of New York City at the Kings Theatre in Brooklyn on Tuesday, April 26, 2022.

leftLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Nullam aliquet, velit at suscipit vulputate, dolor leo varius neque, in facilisis dolor mauris consectetur enim. Mauris a bibendum libero.

Inline - Left, Caption

<div class="img-left">
  <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
  <div class="img-caption">InsertCaptionHere</div>
</div>

Inline - Left, No Caption

<div class="img-left">
  <img src="/assets/oti/images/content/pages/about/inline-imagesinsert.zzz" alt="insert" />
</div>

NOTE: For inline images, each separating paragraph tag <p> should be replaced with two line-break tags including the trailing space and slash, like this: <br /> <br />.

The Mayor on a Citi bike, flanked by other bicyclist on each side

Mayor Eric Adams and administration officials lead a bike ride to mark Car Free Earth Day. Saturday, April 23, 2022.

rightMaecenas euismod sagittis aliquet. Curabitur massa erat, tristique suscipit sodales nec, interdum cursus dolor.

Nullam quis faucibus ipsum.

Aliquam pulvinar diam vel nisi varius malesuada.

Sed euismod suscipit purus, tempus rhoncus massa posuere vitae. Aliquam quis dapibus mi. Cras id bibendum mi.

Ut aliquam justo sit amet erat mattis semper. Donec dignissim, sem id luctus lacinia, erat mi ultrices massa, sit amet ultricies nulla felis ut ipsum. Mauris placerat tempus orci et fringilla. Duis aute irure dolor in reprehenderit in voluptate velit esse.

Inline - Right, Caption

<div class="img-right">
  <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
  <div class="img-caption">InsertCaptionHere</div>
</div>

Inline - Right, No Caption

<div class="img-right">
  <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
</div>

Row Images

Image Min Width: 800px | Recommend .jpg Quality 60 for Photos

Responsive Display Widths: Per Container from 768px to 960+px; 100% below 767px

New York City Mayor Eric Adams delivers an address on his first 100 days and the future of New York City at the Kings Theatre in Brooklyn on Tuesday, April 26, 2022.

1-upIn rutrum fringilla sem, ut molestie leo commodo vel. Donec scelerisque consectetur malesuada. Nam at ornare augue, eu consectetur enim. Etiam ac massa eleifend, volutpat metus sed, tincidunt dolor. Praesent interdum elit in magna molestie rutrum.

Vestibulum vestibulum iaculis sapien a cursus. Suspendisse vitae tincidunt nulla. Cras enim quam, varius eu nisi a, tincidunt tristique enim.

Row - 1-up

<div class="row img-row">
  <div class="span12">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
</div>

Mayor Eric Adams and administration officials lead a bike ride to mark Car Free Earth Day. City Hall to Brooklyn. Saturday, April 23, 2022.

The Mayor with a small shear in hand, examine fresh cut herbs from the rooftop farm

Mayor Eric Adams open a new rooftop farm on the room of a new office building on Staten Island that grows healthy organic food and absorbs stormwater.

2-upIn rutrum fringilla sem, ut molestie leo commodo vel. Donec scelerisque consectetur malesuada. Nam at ornare augue, eu consectetur enim. Etiam ac massa eleifend, volutpat metus sed, tincidunt dolor. Praesent interdum elit in magna molestie rutrum.

Vestibulum vestibulum iaculis sapien a cursus. Suspendisse vitae tincidunt nulla. Cras enim quam, varius eu nisi a, tincidunt tristique enim.

Row - 2-up

<div class="row img-row">
  <div class="span6">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
  <div class="span6">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
</div>

Mayor Eric Adams and administration officials lead a bike ride to mark Car Free Earth Day. Saturday, April 23, 2022.

Green Lawn with Bridge in Background, November 5, 2013

Mayor Eric Adams open a new rooftop farm on the room of a new office building on Staten Island that grows healthy organic food and absorbs stormwater.

3-upIn rutrum fringilla sem, ut molestie leo commodo vel. Donec scelerisque consectetur malesuada. Nam at ornare augue, eu consectetur enim. Etiam ac massa eleifend, volutpat metus sed, tincidunt dolor. Praesent interdum elit in magna molestie rutrum.

Vestibulum vestibulum iaculis sapien a cursus. Suspendisse vitae tincidunt nulla. Cras enim quam, varius eu nisi a, tincidunt tristique enim.

Row - 3-up

<div class="row img-row">
  <div class="span4">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
  <div class="span4">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
  <div class="span4">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
</div>

Mayor Eric Adams and administration officials lead a bike ride to mark Car Free Earth Day.

Green Lawn with Bridge in Background, November 5, 2013

Mayor Eric Adams open a new rooftop farm on the room of a new office building on Staten Island that grows healthy organic food and absorbs stormwater.

Golfer on a golf course

4-upIn rutrum fringilla sem, ut molestie leo commodo vel. Donec scelerisque consectetur malesuada. Nam at ornare augue, eu consectetur enim. Etiam ac massa eleifend, volutpat metus sed, tincidunt dolor. Praesent interdum elit in magna molestie rutrum.

Vestibulum vestibulum iaculis sapien a cursus. Suspendisse vitae tincidunt nulla. Cras enim quam, varius eu nisi a, tincidunt tristique enim.

Row - 4-up

<div class="row img-row">
  <div class="span3">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
  <div class="span3">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
    <div class="span3">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
  <div class="span3">
    <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
    <div class="img-caption">InsertCaptionHere</div>
  </div>
</div>

Inline Images - Vertical

Image Min Width: 500px | Recommend .jpg Quality 60 for Photos

Responsive Display Widths: Per Container from 480px to 960+px; 100% below 479px

Portrait Image 01 - image of a cheetah. This image is a placeholder image designed to reflect the placement of a portrait.

Firstname Lastname (of the person in the image, if it was a portrait)

left vertLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Nullam aliquet, velit at suscipit vulputate, dolor leo varius neque, in facilisis dolor mauris consectetur enim. Mauris a bibendum libero.

In fermentum justo sed risus hendrerit, dictum fringilla orci ornare. Nullam mattis fermentum orci ut mollis. Sed pulvinar, sapien eget porttitor euismod, ligula elit molestie nunc, laoreet tempor ipsum lectus non turpis. Mauris laoreet porta libero at dictum. Maecenas eu eros eget ligula accumsan dapibus sit amet nec nulla. Nunc laoreet magna vitae purus blandit, non consequat est tincidunt. Praesent vitae luctus massa.

Integer a velit lorem. Quisque a tristique dolor, faucibus egestas quam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis viverra lacus eget arcu molestie luctus. Suspendisse congue condimentum aliquet. Praesent sit amet magna augue. Cras nec enim ac enim adipiscing tincidunt. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed pharetra molestie dui, eu lacinia nibh viverra vel.

Inline Vertical - Left, Caption

<div class="img-left-vert">
  <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
  <div class="img-caption">InsertCaptionHere</div>
</div>

Portrait Image 02 - three women on a stage. This image is a placeholder image designed to reflect the placement of a portrait.

Firstname2 Lastname2 (of the person in the image, if it was a portrait)

right vertMaecenas euismod sagittis aliquet. Curabitur massa erat, tristique suscipit sodales nec, interdum cursus dolor.

Nullam quis faucibus ipsum.

Aliquam pulvinar diam vel nisi varius malesuada.

Sed euismod suscipit purus, tempus rhoncus massa posuere vitae. Aliquam quis dapibus mi. Cras id bibendum mi.

Ut aliquam justo sit amet erat mattis semper. Donec dignissim, sem id luctus lacinia, erat mi ultrices massa, sit amet ultricies nulla felis ut ipsum. Mauris placerat tempus orci et fringilla. Duis aute irure dolor in reprehenderit in voluptate velit esse.

In fermentum justo sed risus hendrerit, dictum fringilla orci ornare. Nullam mattis fermentum orci ut mollis. Sed pulvinar, sapien eget porttitor euismod, ligula elit molestie nunc, laoreet tempor ipsum lectus non turpis. Mauris laoreet porta libero at dictum. Maecenas eu eros eget ligula accumsan dapibus sit amet nec nulla. Nunc laoreet magna vitae purus blandit, non consequat est tincidunt. Praesent vitae luctus massa.

Integer a velit lorem. Quisque a tristique dolor, faucibus egestas quam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis viverra lacus eget arcu molestie luctus. Suspendisse congue condimentum aliquet. Praesent sit amet magna augue. Cras nec enim ac enim adipiscing tincidunt. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed pharetra molestie dui, eu lacinia nibh viverra vel.

Inline Vertical - Right, Caption

<div class="img-right-vert">
  <img src="/assets/oti/images/content/pages/about/inline-images/insert.zzz" alt="insert" />
  <div class="img-caption">InsertCaptionHere</div>
</div>