{"id":1716,"date":"2014-02-12T18:47:20","date_gmt":"2014-02-12T18:47:20","guid":{"rendered":"http:\/\/www.redfactory.nl\/themes\/thecompany\/?page_id=1716"},"modified":"2014-02-12T18:47:20","modified_gmt":"2014-02-12T18:47:20","slug":"shortcodes","status":"publish","type":"page","link":"https:\/\/www.taxitam.it\/index.php\/shortcodes\/","title":{"rendered":"Shortcodes"},"content":{"rendered":"<p>This theme uses Twitter Bootstrap as a strong foundation. This also means that there are a ton of integrated features that you can make use of out of the box. To do this easily you can install the &#8220;Easy Bootstrap Shortcode&#8221; plugin. You can download the plugin here:\u00a0<a href=\"http:\/\/wordpress.org\/plugins\/easy-bootstrap-shortcodes\/\" target=\"_blank\">http:\/\/wordpress.org\/plugins\/easy-bootstrap-shortcodes\/<\/a><\/p>\n<p>Below is an example of all the elements that you can use in this theme!<\/p>\n<p>&nbsp;<\/p>\n<h2>Progress bars<\/h2>\n<div class=\"progress   osc-progressbar\">\n  <div class=\"progress-bar \"  role=\"progressbar\" aria-valuenow=\"90\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 90%\">\n    <span class=\"sr-only\">90% Complete<\/span>\n  <\/div>\n<\/div>\n<div class=\"progress progress-striped  osc-progressbar\">\n  <div class=\"progress-bar progress-bar-success\"  role=\"progressbar\" aria-valuenow=\"50\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 50%\">\n    <span class=\"sr-only\">50% Complete<\/span>\n  <\/div>\n<\/div>\n<div class=\"progress progress-striped active  osc-progressbar\">\n  <div class=\"progress-bar progress-bar-info\"  role=\"progressbar\" aria-valuenow=\"30\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 30%\">\n    <span class=\"sr-only\">30% Complete<\/span>\n  <\/div>\n<\/div>\n<div class=\"progress progress-striped active  osc-progressbar\">\n  <div class=\"progress-bar progress-bar-warning\"  role=\"progressbar\" aria-valuenow=\"70\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 70%\">\n    <span class=\"sr-only\">70% Complete<\/span>\n  <\/div>\n<\/div>\n<div class=\"progress progress-striped active  osc-progressbar\">\n  <div class=\"progress-bar progress-bar-danger\"  role=\"progressbar\" aria-valuenow=\"100\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 100%\">\n    <span class=\"sr-only\">100% Complete<\/span>\n  <\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<h2>Toggles<\/h2>\n<div class=\"panel-group yourcustomclass\" id=\"oscitas-accordion-0\">        <div class=\"panel panel-default\">\n            <div class=\"panel-heading\">\n              <h4 class=\"panel-title\">\n                <a class=\"accordion-toggle collapsed\" data-toggle=\"collapse\"\n                data-parent=\"#oscitas-accordion-0\"\n                href=\"#details-0-0\">\n                Accordion #1\n                <\/a>\n              <\/h4>\n            <\/div>\n            <div id=\"details-0-0\" class=\"panel-collapse collapse in\">\n              <div class=\"panel-body\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus volutpat, sem et lacinia malesuada, arcu turpis feugiat ligula, vel congue augue nisi a tortor. Aenean quis accumsan nulla. Donec molestie commodo ultrices.<\/div>\n            <\/div>\n        <\/div>        <div class=\"panel panel-default\">\n            <div class=\"panel-heading\">\n              <h4 class=\"panel-title\">\n                <a class=\"accordion-toggle collapsed\" data-toggle=\"collapse\"\n                data-parent=\"#oscitas-accordion-0\"\n                href=\"#details-0-1\">\n                Accordion #2\n                <\/a>\n              <\/h4>\n            <\/div>\n            <div id=\"details-0-1\" class=\"panel-collapse collapse \">\n              <div class=\"panel-body\">Praesent quam neque, accumsan non lorem quis, facilisis tempus massa. Integer vehicula neque turpis, vel malesuada quam convallis non.<\/div>\n            <\/div>\n        <\/div>        <div class=\"panel panel-default\">\n            <div class=\"panel-heading\">\n              <h4 class=\"panel-title\">\n                <a class=\"accordion-toggle collapsed\" data-toggle=\"collapse\"\n                data-parent=\"#oscitas-accordion-0\"\n                href=\"#details-0-2\">\n                Accordion #3\n                <\/a>\n              <\/h4>\n            <\/div>\n            <div id=\"details-0-2\" class=\"panel-collapse collapse \">\n              <div class=\"panel-body\">Nullam nec fringilla magna. Donec sagittis, justo gravida feugiat vehicula, sapien erat eleifend sapien, sit amet iaculis leo diam quis risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.<\/div>\n            <\/div>\n        <\/div>        <div class=\"panel panel-default\">\n            <div class=\"panel-heading\">\n              <h4 class=\"panel-title\">\n                <a class=\"accordion-toggle collapsed\" data-toggle=\"collapse\"\n                data-parent=\"#oscitas-accordion-0\"\n                href=\"#details-0-3\">\n                Accordion #4\n                <\/a>\n              <\/h4>\n            <\/div>\n            <div id=\"details-0-3\" class=\"panel-collapse collapse \">\n              <div class=\"panel-body\">Nulla sed vestibulum diam. In suscipit dignissim lacus quis aliquet. Cras vehicula ligula eget aliquam bibendum. Curabitur lacinia, erat sed laoreet pulvinar, arcu lacus volutpat magna, at commodo diam nibh quis augue.<\/div>\n            <\/div>\n        <\/div><\/div>\n<p>&nbsp;<\/p>\n<h2>Tabs<\/h2>\n<div class=\"yourcustomclass\"><ul class=\"nav nav-tabs\" id=\"oscitas-tabs-0\"><li class=\"active\"><a class=\"\" href=\"#pane-0-0\" data-toggle=\"tab\">Tab number 1<\/a><\/li><li class=\"\"><a class=\"\" href=\"#pane-0-1\" data-toggle=\"tab\">Tab number 2<\/a><\/li><li class=\"\"><a class=\"\" href=\"#pane-0-2\" data-toggle=\"tab\">Tab number 3<\/a><\/li><li class=\"\"><a class=\"\" href=\"#pane-0-3\" data-toggle=\"tab\">Tab number 4<\/a><\/li><\/ul><div class=\"tab-content\"><div class=\"tab-pane active\" id=\"pane-0-0\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus volutpat, sem et lacinia malesuada, arcu turpis feugiat ligula, vel congue augue nisi a tortor. Aenean quis accumsan nulla. Donec molestie commodo ultrices.<\/div><div class=\"tab-pane \" id=\"pane-0-1\">Praesent quam neque, accumsan non lorem quis, facilisis tempus massa. Integer vehicula neque turpis, vel malesuada quam convallis non.<\/div><div class=\"tab-pane \" id=\"pane-0-2\">Nullam nec fringilla magna. Donec sagittis, justo gravida feugiat vehicula, sapien erat eleifend sapien, sit amet iaculis leo diam quis risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.<\/div><div class=\"tab-pane \" id=\"pane-0-3\">Nulla sed vestibulum diam. In suscipit dignissim lacus quis aliquet. Cras vehicula ligula eget aliquam bibendum. Curabitur lacinia, erat sed laoreet pulvinar, arcu lacus volutpat magna, at commodo diam nibh quis augue.<\/div><\/div><\/div>\n<p>&nbsp;<\/p>\n<h2>Lists<\/h2>\n<ul class=\"list-group \"><li class=\"list-group-item\"><span class=\"glyphicon glyphicon-arrow-right\"><\/span> You can make nice lists<\/li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-arrow-right\"><\/span> With this simple shortcode<\/li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-arrow-right\"><\/span> And select any glyphicon you want!<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h2>Buttons<\/h2>\n<p>You can also use\u00a0glyphicon in buttons!<\/p>\n<a class=\"btn btn-info btn-lg  \" href=\"#\"  rel=\"\"  target=\"_self\">Button<\/a>\n<button class=\"btn btn-default btn-lg  \" ><i class=\"glyphicon glyphicon-thumbs-up\" ><\/i> Button<\/button>\n<button class=\"btn btn-primary btn-lg  \" ><i class=\"glyphicon glyphicon-certificate\" style=\"color:#fff;\"><\/i> Button<\/button>\n<p>&nbsp;<\/p>\n<h2>Notifications<\/h2>\n<div class = \"alert alert-warning alert-dismissable \"><button type = \"button\" class = \"close\" data-dismiss = \"alert\" aria-hidden = \"true\">&times;\n    <\/button>Your notification<\/div>\n<div class = \"alert alert-success alert-dismissable \"><button type = \"button\" class = \"close\" data-dismiss = \"alert\" aria-hidden = \"true\">&times;\n    <\/button>Your notification<\/div>\n<div class = \"alert alert-info alert-dismissable \"><button type = \"button\" class = \"close\" data-dismiss = \"alert\" aria-hidden = \"true\">&times;\n    <\/button>Your notification<\/div>\n<div class = \"alert alert-danger alert-dismissable \"><button type = \"button\" class = \"close\" data-dismiss = \"alert\" aria-hidden = \"true\">&times;\n    <\/button>Your notification<\/div>\n<p>&nbsp;<\/p>\n<h2>Columns<\/h2>\n<div class=\"row \"><div class=\"col-lg-6 col-md-12 col-xs-12 col-sm-12\">\nInteger gravida adipiscing odio id pellentesque. Nulla sodales hendrerit mauris eget venenatis. Pellentesque ac dui malesuada, sagittis velit eu, ornare velit. Donec placerat, purus sit amet tincidunt pellentesque, risus lectus tincidunt quam, sit amet imperdiet lectus erat sed mauris.<\/div>\n<div class=\"col-lg-6 col-md-12 col-xs-12 col-sm-12\">\nInteger gravida adipiscing odio id pellentesque. Nulla sodales hendrerit mauris eget venenatis. Pellentesque ac dui malesuada, sagittis velit eu, ornare velit. Donec placerat, purus sit amet tincidunt pellentesque, risus lectus tincidunt quam, sit amet imperdiet lectus erat sed mauris.<\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<div class=\"row \"><div class=\"col-lg-4 col-md-12 col-xs-12 col-sm-12\">\nInteger gravida adipiscing odio id pellentesque. Nulla sodales hendrerit mauris eget venenatis. Pellentesque ac dui malesuada, sagittis velit eu, ornare velit.<\/div>\n<div class=\"col-lg-4 col-md-12 col-xs-12 col-sm-12\">\nInteger gravida adipiscing odio id pellentesque. Nulla sodales hendrerit mauris eget venenatis. Pellentesque ac dui malesuada, sagittis velit eu, ornare velit.<\/div>\n<div class=\"col-lg-4 col-md-12 col-xs-12 col-sm-12\">\nInteger gravida adipiscing odio id pellentesque. Nulla sodales hendrerit mauris eget venenatis. Pellentesque ac dui malesuada, sagittis velit eu, ornare velit.<\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<div class=\"row \"><div class=\"col-lg-3 col-md-12 col-xs-12 col-sm-12\">\nInteger gravida adipiscing odio id pellentesque. Nulla sodales hendrerit mauris eget venenatis.<\/div>\n<div class=\"col-lg-3 col-md-12 col-xs-12 col-sm-12\">\nInteger gravida adipiscing odio id pellentesque. Nulla sodales hendrerit mauris eget venenatis.<\/div>\n<div class=\"col-lg-3 col-md-12 col-xs-12 col-sm-12\">\nInteger gravida adipiscing odio id pellentesque. Nulla sodales hendrerit mauris eget venenatis.<\/div>\n<div class=\"col-lg-3 col-md-12 col-xs-12 col-sm-12\">\nInteger gravida adipiscing odio id pellentesque. Nulla sodales hendrerit mauris eget venenatis.<\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<h2>Responsive tables<\/h2>\n<div class=\"table-responsive\"><table width=\"100%\" class=\"table \" style=\" table-hover\"><br \/>\n<thead><tr>\n<th>Heading-1<\/th>\n<th>Heading-2<\/th>\n<th>Heading-3<\/th>\n<th>Heading-4<\/th>\n<\/tr><\/thead>\n<tbody>\n<tr>\n<td>value-1<\/td>\n<td>value-2<\/td>\n<td>value-3<\/td>\n<td>value-4<\/td>\n<\/tr>\n<tr>\n<td>value-1<\/td>\n<td>value-2<\/td>\n<td>value-3<\/td>\n<td>value-4<\/td>\n<\/tr>\n<tr>\n<td>value-1<\/td>\n<td>value-2<\/td>\n<td>value-3<\/td>\n<td>value-4<\/td>\n<\/tr>\n<tr>\n<td>value-1<\/td>\n<td>value-2<\/td>\n<td>value-3<\/td>\n<td>value-4<\/td>\n<\/tr>\n<\/tbody>\n<\/table><\/div>\n<p>&nbsp;<\/p>\n<h2>Tooltips<\/h2>\n<p>You can use tooltips in your content to <a  href=\"#\" data-placement=\"top\" title=\"This is a tooltip!\"  class=\"osc_tooltip \" target=\"\">explain<\/a>\n\n    <script>\n        jQuery(document).ready(function() {\n            jQuery('.osc_tooltip').tooltip();\n        });\n    <\/script>\n    \u00a0something.\u00a0Curabitur eget leo laoreet, laoreet lorem ut, suscipit sapien. Nam ut laoreet enim. Phasellus venenatis auctor ante nec bibendum. Vivamus diam justo, mollis vel elit nec, aliquam convallis augue. Sed a faucibus nisl.<br \/>\n<span style=\"font-size: 13px;\"><h2 class=\"\" > <span class=\" glyphicon glyphicon-ok\" style=\"color:#666;\"><\/span> Heading with fancy icons<\/h2><\/span><\/p>\n<p>&nbsp;<\/p>\n<h2>Content panels<\/h2>\n<div class=\"panel panel-default \"><div class=\"panel-heading\">\nMy fancy content title<\/div>\n<div class=\"panel-body\">\nCurabitur nec elit sagittis, aliquam elit at, viverra dui. Mauris velit quam, ultrices at adipiscing id, dignissim non nisi. Aliquam ullamcorper placerat semper. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi nec feugiat nisl. Maecenas pretium enim ac lectus ultrices placerat.<\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<h2>Popovers<\/h2>\n<button class=\"osc_popover btn  btn-default \" data-content=\"Your Content\" data-placement=\"top\" data-toggle=\"popover\" data-trigger=\"click\" data-container=\"body\" type=\"button\" data-title=\"A title\"> Click me to see the popup <\/button>\n    <script>\n       jQuery(document).ready(function(){\n        jQuery('.osc_popover').popover();\n        });\n    <\/script>\n    \n<p>&nbsp;<\/p>\n<h2>Dropdowns<\/h2>\n<div class=\"btn-group  \"> <button type=\"button\" class=\"btn btn-lg btn-default dropdown-toggle\" data-toggle=\"dropdown\">\nDropdown <span class=\"caret\"><\/span> <\/button>\n<ul class=\"dropdown-menu\" role=\"menu\">\n<li><a class=\"\" href=\"#\">Dropdown Item #1<\/a><\/li>\n<li><a class=\"\" href=\"#\">Dropdown Item #2<\/a><\/li>\n<li><a class=\"\" href=\"#\">Dropdown Item #3<\/a><\/li>\n<\/ul>\n<\/div>\n    <script>\n       jQuery(document).ready(function(){\n        jQuery('.dropdown-toggle').dropdown();\n        });\n    <\/script>\n    \n<p>&nbsp;<\/p>\n<h2>Labels<\/h2>\n<span class=\"label label-default \">\nLabel\n<\/span>\n<span class=\"label label-primary \">\nLabel\n<\/span>\n<span class=\"label label-success \">\nLabel\n<\/span>\n<span class=\"label label-info \">\nLabel\n<\/span>\n<span class=\"label label-warning \">\nLabel\n<\/span>\n<span class=\"label label-danger \">\nLabel\n<\/span>\n<p>&nbsp;<\/p>\n<h2>Content box<\/h2>\n<div class=\"well   \">Curabitur nec elit sagittis, aliquam elit at, viverra dui. Mauris velit quam, ultrices at adipiscing id, dignissim non nisi. Aliquam ullamcorper placerat semper. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi nec feugiat nisl. Maecenas pretium enim ac lectus ultrices placerat.<\/div>\n<p>&nbsp;<\/p>\n<h2>Icons<\/h2>\n<p>You can see a full list of the icons you can use here:\u00a0<a href=\"http:\/\/getbootstrap.com\/components\/\" target=\"_blank\">http:\/\/getbootstrap.com\/components\/<\/a><\/p>\n<i class=\" glyphicon glyphicon-star \" style=\"color:#0a0a0a; font-size:20px;\"><\/i>\n<i class=\" glyphicon glyphicon-warning-sign \" style=\" font-size:20px;\"><\/i>\n<i class=\" glyphicon glyphicon-exclamation-sign \" style=\" font-size:20px;\"><\/i>\n<i class=\" glyphicon glyphicon-usd \" style=\" font-size:20px;\"><\/i>\n<p>&nbsp;<\/p>\n<h2>Rounded images<\/h2>\n<div class=\"row \"><div class=\"col-lg-3 col-md-6 col-xs-12 col-sm-6\">\n<img src=\"http:\/\/www.redfactory.nl\/themes\/thebeautysalon2\/files\/2013\/12\/Depositphotos_10297634_s-150x150.png\" class=\" img-circle\">\n<\/div>\n<div class=\"col-lg-3 col-md-6 col-xs-12 col-sm-6\">\n<img src=\"http:\/\/www.redfactory.nl\/themes\/thebeautysalon2\/files\/2013\/12\/shutterstock_33195415-150x150.jpg\" class=\" img-circle\">\n<\/div>\n<div class=\"col-lg-3 col-md-6 col-xs-12 col-sm-6\">\n<img src=\"http:\/\/www.redfactory.nl\/themes\/thebeautysalon2\/files\/2013\/12\/shutterstock_2454493-150x150.jpg\" class=\" img-circle\">\n<\/div>\n<div class=\"col-lg-3 col-md-6 col-xs-12 col-sm-6\">\n<img src=\"http:\/\/www.redfactory.nl\/themes\/thebeautysalon2\/files\/2013\/12\/shutterstock_3254986-150x150.jpg\" class=\" img-circle\">\n<\/div>\n<\/div>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This theme uses Twitter Bootstrap as a strong foundation. This also means that there are a ton of integrated features that you can make use of out of the box. To do this easily you can install the &#8220;Easy Bootstrap Shortcode&#8221; plugin. You can download the plugin here:\u00a0http:\/\/wordpress.org\/plugins\/easy-bootstrap-shortcodes\/ Below is an example of all the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"ngg_post_thumbnail":0},"_links":{"self":[{"href":"https:\/\/www.taxitam.it\/index.php\/wp-json\/wp\/v2\/pages\/1716"}],"collection":[{"href":"https:\/\/www.taxitam.it\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.taxitam.it\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.taxitam.it\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.taxitam.it\/index.php\/wp-json\/wp\/v2\/comments?post=1716"}],"version-history":[{"count":0,"href":"https:\/\/www.taxitam.it\/index.php\/wp-json\/wp\/v2\/pages\/1716\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.taxitam.it\/index.php\/wp-json\/wp\/v2\/media?parent=1716"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}