<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">

 <title>Andrew Worsfold</title>
 <link href="http://andrewworsfold.com/atom.xml" rel="self"/>
 <link href="http://andrewworsfold.com/"/>
 <updated>2016-06-26T11:51:58+00:00</updated>
 <id>http://andrewworsfold.com</id>
 <author>
   <name>Andrew Worsfold</name>
   <email>andrew.worsfold@gmail.com</email>
 </author>

 
 <entry>
   <title>Working with containers</title>
   <link href="http://andrewworsfold.com/2016/06/26/working-with-containers/"/>
   <updated>2016-06-26T00:00:00+00:00</updated>
   <id>http://andrewworsfold.com/2016/06/26/working-with-containers</id>
   <content type="html">&lt;p&gt;The latest version of the &lt;a href=&quot;http://www.gettailor.com&quot;&gt;Tailor page builder&lt;/a&gt; for WordPress (1.2.0) changes the way that container elements like tabs, lists and carousels behave.  Now, instead of collapsing when only one child element remains, they will exist until all children have been removed or destroyed.&lt;/p&gt;

&lt;h2 id=&quot;removing-children&quot;&gt;Removing children&lt;/h2&gt;

&lt;p&gt;&lt;img src=&quot;/img/gifs/list-removing.gif&quot; alt=&quot;Removing children from containers in Tailor&quot; title=&quot;Removing children from containers in Tailor&quot; /&gt;&lt;/p&gt;

&lt;p&gt;&lt;b&gt;Note:&lt;/b&gt; this does not apply to row and column structures.  If a column is removed from a row leaving only one other column, the remaining row and column will collapse as expected.&lt;/p&gt;

&lt;p&gt;&lt;img src=&quot;/img/gifs/row-collapsing.gif&quot; alt=&quot;Collapsing rows in Tailor&quot; title=&quot;Collapsing rows in Tailor&quot; /&gt;&lt;/p&gt;

&lt;p&gt;In the image above, the first column is destroyed leaving only the second column.  The remaining row and column collapse, leaving only the elements from the second column (in this case a content element).  Because the colours were applied at the column level, the content element appears unstyled.&lt;/p&gt;

&lt;h2 id=&quot;adding-children&quot;&gt;Adding children&lt;/h2&gt;

&lt;p&gt;Adding children to containers works exactly the same as before.  Simply drag the desired element(s) over the center of the container.&lt;/p&gt;

&lt;p&gt;&lt;img src=&quot;/img/gifs/tabs-adding.gif&quot; alt=&quot;Adding children to containers in Tailor&quot; title=&quot;Adding children to containers in Tailor&quot; /&gt;&lt;/p&gt;

&lt;h2 id=&quot;reordering-children&quot;&gt;Reordering children&lt;/h2&gt;

&lt;p&gt;Reordering children is possible for all container types; though the exact method can differ.  For example:&lt;/p&gt;

&lt;h3 id=&quot;tabs&quot;&gt;Tabs&lt;/h3&gt;
&lt;p&gt;&lt;img src=&quot;/img/gifs/tabs-reordering.gif&quot; alt=&quot;Reordering tabs in Tailor&quot; title=&quot;Reordering tabs in Tailor&quot; /&gt;&lt;/p&gt;

&lt;h3 id=&quot;toggles&quot;&gt;Toggles&lt;/h3&gt;
&lt;p&gt;&lt;img src=&quot;/img/gifs/toggles-reordering.gif&quot; alt=&quot;Reordering toggles in Tailor&quot; title=&quot;Reordering toggles in Tailor&quot; /&gt;&lt;/p&gt;

&lt;h2 id=&quot;carousel-items&quot;&gt;Carousel items&lt;/h2&gt;
&lt;p&gt;&lt;img src=&quot;/img/gifs/carousel-reordering.gif&quot; alt=&quot;Reordering carousel items in Tailor&quot; title=&quot;Reordering carousel items in Tailor&quot; /&gt;&lt;/p&gt;
</content>
 </entry>
 
 <entry>
   <title>Device previews</title>
   <link href="http://andrewworsfold.com/2016/06/25/device-previews/"/>
   <updated>2016-06-25T00:00:00+00:00</updated>
   <id>http://andrewworsfold.com/2016/06/25/device-previews</id>
   <content type="html">&lt;p&gt;The latest version of the &lt;a href=&quot;http://www.gettailor.com&quot;&gt;Tailor page builder&lt;/a&gt; for WordPress (1.1.3) aligns the device preview and media query functionality of the plugin with that of the WordPress Customizer.&lt;/p&gt;

&lt;h2 id=&quot;device-previews&quot;&gt;Device previews&lt;/h2&gt;

&lt;p&gt;Choose from one of three device sizes to preview your page in that size:&lt;/p&gt;

&lt;ol&gt;
  &lt;li&gt;Desktop&lt;/li&gt;
  &lt;li&gt;Tablet&lt;/li&gt;
  &lt;li&gt;Mobile&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;img src=&quot;/img/tailor-device-preview.png&quot; alt=&quot;Device previews in Tailor&quot; title=&quot;Device previews in Tailor&quot; /&gt;&lt;/p&gt;

&lt;h2 id=&quot;responsive-settings&quot;&gt;Responsive settings&lt;/h2&gt;

&lt;p&gt;These sizes are now also used in the settings for certain elements.  For example, you can specify the minimum screen size that columns within a row should be displayed as columns (instead of being stacked on top of one another).&lt;/p&gt;

&lt;p&gt;&lt;img src=&quot;/img/tailor-responsive-settings.png&quot; alt=&quot;Responsive settings in Tailor&quot; title=&quot;Responsive settings in Tailor&quot; /&gt;&lt;/p&gt;
</content>
 </entry>
 
 <entry>
   <title>New beginnings</title>
   <link href="http://andrewworsfold.com/2016/01/03/introduction/"/>
   <updated>2016-01-03T00:00:00+00:00</updated>
   <id>http://andrewworsfold.com/2016/01/03/introduction</id>
   <content type="html">&lt;p&gt;Today I’ve launched not only this new Jekyll-powered website, but a WordPress plugin called &lt;a href=&quot;http://gettailor.com&quot;&gt;Tailor&lt;/a&gt;.  Tailor is a frontend page builder that allows for quick and easy layout creation using an intuitive drag-and-drop interface.  It’s completely free, so if you’re interested in creating a website using WordPress and would like to create cool layouts using your favourite theme without the need for custom code then give it a shot!&lt;/p&gt;

&lt;p&gt;You can find Tailor on the &lt;a href=&quot;http://wordpress.org/plugins/tailor/&quot;&gt;WordPress plugin repository&lt;/a&gt; and as an open source project on &lt;a href=&quot;http://github.com/andrew-worsfold/tailor/&quot;&gt;GitHub&lt;/a&gt;.  Feel free to share your thoughts of the plugin with my on &lt;a href=&quot;http://twitter.com/andrewjworsfold/&quot;&gt;Twitter&lt;/a&gt;!&lt;/p&gt;
</content>
 </entry>
 

</feed>
