WordPress Component Library
10up Engineering

Organization

The organization component gives you all the microdata you need to properly markup a company to be displayed in a Google search results card. When modifying this component you should feel free to use any HTML that fits the structure and hierarchy of your project, while maintaining any of the schema-related HTML attributes (itemscope, itemtype, itemprop, etc.).

HTML

<div itemscope itemtype="http://schema.org/Organization">

	<!--same as logo.html-->
	<a itemprop="url" href="http://www.example.com/">
		<img itemprop="logo" src="https://placekitten.com/g/200/100" srcset="https://placekitten.com/g/200/100 1x, https://placekitten.com/g/400/200 2x" alt="" />
		<!--
			Visually hide this text.
			WCAG 2.0: “image alt text cannot be the primary text of a link"
	     -->
		<span class="screen-reader-text">Amazing Company</span>
	</a>

	<!-- the name of the organization -->
	<h3 itemprop="name">Amazing Company</h3>

	<!-- address -->
	<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
		<p><strong>Address</strong>:
			<span itemprop="streetAddress">35 Broad St</span>,
			<span itemprop="addressLocality">Red Bank</span>,
			<span itemprop="addressRegion"><abbr title="New Jersey">NJ</abbr></span>
			<span itemprop="postalCode">07701</span>
		</p>
	</div><!--/itemtype=PostalAddress-->

	<!-- Contact information -->
	<p><strong>Phone</strong>:
		<a href="tel:+14251235678" itemprop="telephone">(425) 123-4567</a>
	</p>

	<p><strong>Fax</strong>:
		<a href="fax:+14251235678" itemprop="faxNumber">(425) 987-0987</a>
	</p>

	<p><strong>Email</strong>:
		<a href="mailto:hello@example.com" itemprop="email">hello@example.com</a>
	</p>

	<!-- Personel inforamtion -->
	<p><strong>Founder</strong>:
		<span itemprop="founder" itemscope itemtype="http://schema.org/Person">
			<span itemprop="name">Jayne D. Founder</span>
		</span>
	</p>

	<p><strong>Current employees of this company</strong>:
		<span itemprop="employee" itemscope itemtype="http://schema.org/Person">
			<a href="mailto:elle.harrison@example.com" itemprop="email">
				<span itemprop="name">Elle Harrison</span>
			</a>
		</span>,

		<span itemprop="employee" itemscope itemtype="http://schema.org/Person">
			<a href="mailto:james.wormington@example.com" itemprop="email">
				<span itemprop="name">James Wormington</span>
			</a>
		</span>
	</p>

	<p><strong>Former employees (alumni) of this company</strong>:
		<span itemprop="alumni" itemscope itemtype="http://schema.org/Person">
			<span itemprop="name">Jack Dan</span>
		</span>,

		<span itemprop="alumni" itemscope itemtype="http://schema.org/Person">
			<span itemprop="name">John Smith</span>
		</span>
	</p>

</div><!--/itemtype=Organization-->
<div itemscope itemtype="http://schema.org/Organization">

	<!--same as logo.html-->
	<a itemprop="url" href="http://www.example.com/">
		<img itemprop="logo" src="https://placekitten.com/g/200/100" srcset="https://placekitten.com/g/200/100 1x, https://placekitten.com/g/400/200 2x" alt="" />
		<!--
			Visually hide this text.
			WCAG 2.0: “image alt text cannot be the primary text of a link"
	     -->
		<span class="screen-reader-text">Amazing Company</span>
	</a>

	<!-- the name of the organization -->
	<h3 itemprop="name">Amazing Company</h3>

	<!-- address -->
	<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
		<p><strong>Address</strong>:
			<span itemprop="streetAddress">35 Broad St</span>,
			<span itemprop="addressLocality">Red Bank</span>,
			<span itemprop="addressRegion"><abbr title="New Jersey">NJ</abbr></span>
			<span itemprop="postalCode">07701</span>
		</p>
	</div><!--/itemtype=PostalAddress-->

	<!-- Contact information -->
	<p><strong>Phone</strong>:
		<a href="tel:+14251235678" itemprop="telephone">(425) 123-4567</a>
	</p>

	<p><strong>Fax</strong>:
		<a href="fax:+14251235678" itemprop="faxNumber">(425) 987-0987</a>
	</p>

	<p><strong>Email</strong>:
		<a href="mailto:hello@example.com" itemprop="email">hello@example.com</a>
	</p>

	<!-- Personel inforamtion -->
	<p><strong>Founder</strong>:
		<span itemprop="founder" itemscope itemtype="http://schema.org/Person">
			<span itemprop="name">Jayne D. Founder</span>
		</span>
	</p>

	<p><strong>Current employees of this company</strong>:
		<span itemprop="employee" itemscope itemtype="http://schema.org/Person">
			<a href="mailto:elle.harrison@example.com" itemprop="email">
				<span itemprop="name">Elle Harrison</span>
			</a>
		</span>,

		<span itemprop="employee" itemscope itemtype="http://schema.org/Person">
			<a href="mailto:james.wormington@example.com" itemprop="email">
				<span itemprop="name">James Wormington</span>
			</a>
		</span>
	</p>

	<p><strong>Former employees (alumni) of this company</strong>:
		<span itemprop="alumni" itemscope itemtype="http://schema.org/Person">
			<span itemprop="name">Jack Dan</span>
		</span>,

		<span itemprop="alumni" itemscope itemtype="http://schema.org/Person">
			<span itemprop="name">John Smith</span>
		</span>
	</p>

</div><!--/itemtype=Organization-->

Resources