{"id":33,"date":"2011-05-02T11:45:48","date_gmt":"2011-05-02T11:45:48","guid":{"rendered":"http:\/\/192.168.1.50\/Themes\/2012\/Nano2\/Website_WP\/?page_id=33"},"modified":"2015-08-26T14:40:48","modified_gmt":"2015-08-26T14:40:48","slug":"features","status":"publish","type":"page","link":"https:\/\/altatechstudio.com\/?page_id=33","title":{"rendered":"Theme Features"},"content":{"rendered":"<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <h2>\r\n          Page Appearance\r\n        <\/h2>\r\n        <p>\r\n            This theme provides two different wrapper widths as well as a fullscreen mode. You can easily apply these options through the Warp administration area.\r\n        <\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_page_appearance_01.jpg\" alt=\"Page Apperance\" class=\"tm-shadow\" \/>\r\n        <p>Warp Settings<\/p>\r\n    <\/div>\r\n<\/div>\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_page_appearance_02.jpg\" alt=\"Page Apperance\" \/>\r\n        <p>Small<\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_page_appearance_03.jpg\" alt=\"Page Apperance\" \/>\r\n        <p>Large<\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_page_appearance_04.jpg\" alt=\"Page Apperance\" class=\"tm-shadow\" \/>\r\n        <p>Fullscreen<\/p>\r\n    <\/div>\r\n<\/div>\r\n\r\n<hr>\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <h2>\r\n          Blog Appearance\r\n        <\/h2>\r\n        <p>\r\n          You can select one of five different styles for each section.\r\n        <\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_blog_appearance_01.jpg\" alt=\"Blog Apperance\" class=\"tm-shadow\" \/>\r\n        <p class=\"uk-margin-top uk-margin-bottom\">Warp settings<\/p>\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_blog_appearance_02.jpg\" alt=\"Blog Apperance\" class=\"tm-shadow\" \/>\r\n    <\/div>\r\n<\/div>\r\n\r\n<hr>\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <h2>\r\n          Weather\r\n        <\/h2>\r\n        <p>\r\n            We thought a weather feature might come in handy for a news site. So here it is and here\u2019s how it works. Just insert the following into your editor:\r\n<pre>&lt;div data-weather=&#x0027;&#x007B;&#x0022;location&#x0022;: &#x0022;Hamburg&#x0022;, &#x0022;unit&#x0022;: &#x0022;c&#x0022;&#x007D;&#x0027;&gt;&lt;\/div&gt;<\/pre>\r\nYou can adjust the parameters accordingly. Add your location to the &#8220;location&#8221; option and enter &#8220;c&#8221; for Celsius or &#8220;f&#8221; Fahrenheit as the unit to display the temperature.\r\n        <\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_weather_01.jpg\" alt=\"Blog Apperance\" class=\"tm-shadow\" \/>\r\n        <p class=\"uk-margin-bottom uk-margin-top\">Shortcode<\/p>\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_weather_02.jpg\" alt=\"Blog Apperance\" \/>\r\n    <\/div>\r\n<\/div>\r\n\r\n<hr>\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <h2>\r\n          Tags\r\n        <\/h2>\r\n        <p>\r\n          The Warp administration features the option to assign different colors to tags, highlighting the tagged content. Just go to the &#8220;Tags&#8221; section in the &#8220;Settings&#8221; panel and enter your tag in the field. You can choose from ten predefined colors. For more information on how to use tags, take a look at the <a href=\"https:\/\/en.support.wordpress.com\/posts\/tags\/\" target=\"_blank\">WordPress<\/a> or <a href=\"https:\/\/docs.joomla.org\/J3.x:How_To_Use_Content_Tags_in_Joomla!\" target=\"_blank\">Joomla documentation<\/a>.\r\n        <\/p>\r\n        <p>\r\n            You can apply the same colors to menu items by adding one of the <code>.tm-tag-1<\/code> to <code>.tm-tag-10<\/code> classes.\r\n        <\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_tags_01.jpg\" alt=\"Tags\" class=\"tm-shadow\" \/>\r\n        <p class=\"uk-margin-top\">Warp Settings<\/p>\r\n    <\/div>\r\n<\/div>\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_tags_02.jpg\" alt=\"Tags\" class=\"tm-shadow\" \/>\r\n        <p class=\"uk-margin-top\">Article Tags<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_tags_03.jpg\" alt=\"Tags\" class=\"tm-shadow\" \/>\r\n        <p class=\"uk-margin-top\"><strong>Joomla:<\/strong> Add class <code>.tm-tag-1<\/code> in menus \/ Main Menu \/ Your Page \/ Link Type \/ Link CSS Style<\/p>\r\n        <p><strong>WordPress:<\/strong> Add class <code>.tm-tag-1<\/code> in Appearance \/ Menus \/ Your Page \/ Css Classes<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_tags_04.jpg\" alt=\"Tags\" \/>\r\n\r\n<pre class=\"uk-margin-top uk-margin-bottom\">\r\n&lt;h1 class=\"tm-title-border\"&gt;Title Border&lt;\/h1&gt;\r\n<\/pre>\r\n                <p>\r\n                  To add a border to headings, just use the <code>.tm-title-border<\/code>. You can also add one of the <code>.tm-tag-*<\/code> classes to apply a different color to the border.\r\n                <\/p>\r\n\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n<hr>\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <h2>\r\n          Margin Large\r\n        <\/h2>\r\n        <p>\r\n          To add more spacing between elements, just add the <code>.tm-margin-large<\/code> or <code>.tm-margin-xlarge<\/code> class.\r\n        <\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_margin_large_02.jpg\" alt=\"Margin\" class=\"tm-shadow\" \/>\r\n        <p class=\"uk-margin-top\">Vertical padding: 50px<\/p>\r\n        <p>Horizontal padding: 70px<\/p>\r\n    <\/Div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_margin_large_01.jpg\" alt=\"Margin\" class=\"tm-shadow\" \/>\r\n        <p class=\"uk-margin-top\">Vertical padding: 70px<\/p>\r\n        <p>Horizontal padding: 130px<\/p>\r\n    <\/div>\r\n<\/div>\r\n\r\n<hr>\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <h2>\r\n          Title Border\r\n        <\/h2>\r\n<pre class=\"uk-margin-top uk-margin-bottom\">\r\n&lt;h1 class=\"tm-title-border\"&gt;Title Border&lt;\/h1&gt;\r\n<\/pre>\r\n        <p>\r\n          To add a border to headings, just use the <code>.tm-title-border<\/code>. You can also add one of the <code>.tm-tag-*<\/code> classes to apply a different color to the border.\r\n        <\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_title_border.jpg\" alt=\"Border\" class=\"tm-shadow\" \/>\r\n    <\/div>\r\n<\/div>\r\n\r\n<hr>\r\n\r\n<div class=\"tm-margin-xlarge uk-panel-space\">\r\n    <h2>Article Columns 2<\/h2>\r\n    <p>\r\n        Add the <code>.tm-article-columns-2<\/code> or <code>.tm-article-columns-3<\/code> class to a paragraph element to create a two or three column text block.\r\n    <\/p>\r\n<pre class=\"uk-margin-top uk-margin-bottom\">\r\n&lt;p class=\"tm-article-columns-2\"&gt;...&lt;\/p&gt;\r\n<\/pre>\r\n    <p class=\"tm-article-columns-2\">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.<\/p>\r\n\r\n<pre class=\"uk-margin-large-top uk-margin-bottom\">\r\n&lt;p class=\"tm-article-columns-3\"&gt;...&lt;\/p&gt;\r\n<\/pre>\r\n    <p class=\"tm-article-columns-3\">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.<\/p>\r\n\r\n<\/div>\r\n\r\n<hr>\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <h2>\r\n          Colors\r\n        <\/h2>\r\n<pre class=\"uk-margin-top uk-margin-bottom\">\r\n&lt;h1&gt; ... &lt;span class=\"tm-secondary-color\"&gt;Secondary Colors&lt;\/span&gt; ... &lt;\/h1&gt;\r\n<\/pre>\r\n\r\n        <p>Add the <code>.tm-secondary-color<\/code> to highlight text.<\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-2\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_colors.jpg\" alt=\"Colors\" class=\"tm-shadow\" \/>\r\n    <\/div>\r\n<\/div>\r\n\r\n<hr>\r\n\r\n<div class=\"uk-text-center tm-margin-xlarge\">\r\n    <h2 class=\"uk-h1\">Theme Widgets<\/h2>\r\n    <p class=\"uk-text-large uk-width-large-2-3 uk-margin-large-bottom uk-align-center\">\r\n      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut. Lorem ipsum. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut.\r\n    <\/p>\r\n<\/div>\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <h3 class=\"uk-h2\">Article Widget<\/h3>\r\n        <p>\r\n            Use the Article widget to display WordPress or Joomla content in the same layout as blog articles.\r\n        <\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_widget_article_01.jpg\" alt=\"Widget\" class=\"tm-shadow\" \/>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_widget_article_02.jpg\" alt=\"Widget\" class=\"tm-shadow\" \/>\r\n    <\/div>\r\n<\/div>\r\n\r\n<hr class=\"uk-margin-large-top uk-margin-large-bottom\">\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\" data-uk-grid-margin>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <h3 class=\"uk-h2\">Events Widget<\/h3>\r\n        <p>\r\n            Use the Event widget to add information, like location and time to your content through custom fields. Available custom field names for this widget are <em>tags<\/em>, <em>location<\/em>, <em>location_name<\/em> and <em>time<\/em>. Make sure to use exactly these names. Otherwise Widgetkit will not be able to identify the fields. For more information on custom fields, take a look at the <a href=\"http:\/\/yootheme.com\/widgetkit\/documentation\/customizing\/custom-fields\" target=\"_blank\">Documentation<\/a>.\r\n        <\/p>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_widget_event_01.jpg\" alt=\"Widget\" class=\"tm-shadow\" \/>\r\n    <\/div>\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_widget_event_02.jpg\" alt=\"Widget\" class=\"tm-shadow\" \/>\r\n    <\/div>\r\n<\/div>\r\n\r\n<hr class=\"uk-margin-large-top uk-margin-large-bottom\">\r\n\r\n<div class=\"tm-margin-xlarge\">\r\n\r\n    <div class=\"uk-text-center\">\r\n\r\n        <h3 class=\"uk-h2\">Tabs Sun Widget<\/h3>\r\n        <p class=\"uk-width-large-2-3 uk-margin-large-bottom uk-align-center\">\r\n            Sun features a special Switcher widget with a tabbed navigation. You can adjust the proportion of media and content through the widget administration. When displaying tagged articles, the tag color will be added as a border to the tab.\r\n        <\/p>\r\n\r\n        <img src=\"wp-content\/uploads\/yootheme\/features_widget_tabs_01.jpg\" alt=\"Widget\" class=\"tm-shadow\" \/>\r\n\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n<hr class=\"uk-margin-large-top uk-margin-large-bottom\">\r\n\r\n<div class=\"uk-grid tm-margin-xlarge\">\r\n\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <h3 class=\"uk-h2\">List widget<\/h3>\r\n        <p>The List widget is a simple widget to display content in a list.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n        <h3>list line<\/h3>\r\n\t\t\n<ul class=\"uk-list uk-list-line \">\n\n\n    <li>\n\n        \n            \n                Lorem ipsum dolor\n            \n        \n    <\/li>\n\n\n    <li>\n\n        \n            \n                Lorem ipsum dolor amet\n            \n        \n    <\/li>\n\n\n    <li>\n\n        \n            \n                Lorem ipsum\n            \n        \n    <\/li>\n\n\n<\/ul>\n\r\n    <\/div>\r\n\r\n    <div class=\"uk-width-1-1 uk-width-medium-1-3\">\r\n    <h3>list Striped<\/h3>\r\n      \n<ul class=\"uk-list uk-list-line \">\n\n\n    <li>\n\n        \n            \n                Lorem ipsum dolor sit amet\n            \n        \n    <\/li>\n\n\n    <li>\n\n        \n            \n                Lorem ipsum dolor sit\n            \n        \n    <\/li>\n\n\n    <li>\n\n        \n            \n                Lorem ipsum dolor\n            \n        \n    <\/li>\n\n\n<\/ul>\n\r\n    <\/div>\r\n\r\n<\/div>\r\n","protected":false},"excerpt":{"rendered":"<p>Page Appearance This theme provides two different wrapper widths as well as a fullscreen mode. You can easily apply these options through the Warp administration area. Warp Settings Small Large Fullscreen Blog Appearance You can select one of five different styles for each section. Warp settings Weather We thought a weather feature might come in [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/altatechstudio.com\/index.php?rest_route=\/wp\/v2\/pages\/33"}],"collection":[{"href":"https:\/\/altatechstudio.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/altatechstudio.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/altatechstudio.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/altatechstudio.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=33"}],"version-history":[{"count":0,"href":"https:\/\/altatechstudio.com\/index.php?rest_route=\/wp\/v2\/pages\/33\/revisions"}],"wp:attachment":[{"href":"https:\/\/altatechstudio.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=33"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}