Writing the article

Log in to WordPress with the credentials you have received and click on "Posts --> Add New". If you are more comfortable writing HTML, you can use the "code editor" instead.

Images should be a maximum of 800px wide. Mary Lou will take care of the featured image.

<h2>Section headline example</h2>

Example paragraph, no <p></p> needed:

Lorem 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.

<h3>Sub-section headline example</h3>

For code snippets replace < and > with < and >

Example for HTML:

<pre><code>
&lt;div class="st-container"&gt;
&lt;/div&gt;&lt;!-- // st-container --&gt;
</code></pre>

Available styles and shortcodes

Attention/note box:

<div class="box-attention">
	<strong>Attention:</strong> Some of these techniques are very experimental and won't work in all browsers.
</div>

Codepen embed example:

[codepen_embed height="542" theme_id="light" slug_hash="148b441363a320d4b46cb5ff835525ef" default_tab="result" user="SaraSoueidan"]See the Pen <a href='https://codepen.io/SaraSoueidan/pen/148b441363a320d4b46cb5ff835525ef/'>feTurbluence: baseFrequency</a> by Sara Soueidan (<a href='https://codepen.io/SaraSoueidan'>@SaraSoueidan</a>) on <a href='https://codepen.io'>CodePen</a>.[/codepen_embed]

Codesandbox example:

<iframe src="https://codesandbox.io/embed/v8439q295l?fontsize=12" style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"></iframe>

Gyfcat embed:

[gyfcat_embed id="FocusedSaltyCranefly"]

Optional browser support icons shortcode: [browsersupport chrome="all" safari="all" opera="all" firefox="flag" ie="9+"] (If a browser is not supported at all, just leave it out)

Add this to the end of the article if needed:

<h2>References and Credits</h2>
<ul>
  <li><a href="">Some resource</a></li>
  <li><a href="">Some resource</a></li>
</ul>

Ad shortcode: [adrotate group="2"]