{"id":9798,"date":"2013-04-05T04:42:06","date_gmt":"2013-04-05T04:42:06","guid":{"rendered":"http:\/\/musilda.cz\/?p=57"},"modified":"2013-04-05T04:42:06","modified_gmt":"2013-04-05T04:42:06","slug":"jak-vytvorit-vlastni-shortcode","status":"publish","type":"post","link":"https:\/\/affinite.io\/cs\/jak-vytvorit-vlastni-shortcode\/","title":{"rendered":"Jak vytvo\u0159it vlastn\u00ed shortcode"},"content":{"rendered":"<p>Drtiv\u00e1 v\u011bt\u0161ina premium \u0161ablon obsahuje mno\u017estv\u00ed shortc\u00f3d\u016f, kter\u00e9 usnad\u0148uj\u00ed pr\u00e1ci s obsahem ve wordpressu. Shortc\u00f3d je zkr\u00e1cen\u00fd z\u00e1pis podobn\u00fd bbcode, kter\u00fd vlo\u017e\u00edme do p\u0159\u00edsp\u011bvku, nebo widgetu a syst\u00e9m d\u00edky tomu zavol\u00e1 ji\u017e p\u0159ipravenou funkci. N\u011bkter\u00e9 shortc\u00f3dy umo\u017e\u0148uj\u00ed vkl\u00e1d\u00e1n\u00ed i cel\u00fdch v\u00fdstup\u016f z plugin\u016f.<\/p>\n<p>Jak vytvo\u0159it vlastn\u00ed shortcode tla\u010d\u00edtko<\/p>\n<p>1. Vlastn\u00ed funkce<\/p>\n<p>Do souboru function zap\u00ed\u0161eme funkci<\/p>\n<pre lang=\"php\">function nase_tlacitko1(){\nreturn '<button>Na\u0161e tla\u010d\u00edtko<\/button>';\n}<\/pre>\n<p>Pomoc\u00ed add_shortcode aktivujeme shortc\u00f3d.<\/p>\n<pre lang=\"php\">add_shortcode('tlacitko','nase_tlacitko1');<\/pre>\n<p>Tla\u010d\u00edtko vlo\u017e\u00edme do p\u0159\u00edsp\u011bvku<\/p>\n<pre lang=\"html\">[tlacitko]<\/pre>\n<p>V\u00fdsledek [tlacitko]<br \/>\nCo je ne\u0161ikovn\u00e9, je to, \u017ee nem\u00e1me mo\u017enost ovlivnit text tla\u010d\u00edtka. Proto pomoc\u00ed nov\u00e9 prom\u011bnn\u00e9 p\u0159id\u00e1me obsah tla\u010d\u00edtka. Na\u0161i funkci uprav\u00edme na<\/p>\n<pre lang=\"php\">function nase_tlacitko2($attr,$content = null){\n$out = '<button>'.do_shortcode($content).'<\/button>';\n    return $out;\n}\nadd_shortcode('tlacitko2','nase_tlacitko2');<\/pre>\n<p>Tla\u010d\u00edtko vlo\u017e\u00edme tentokr\u00e1t jako p\u00e1rov\u00fd tag:<\/p>\n<pre lang=\"html\">[tlacitko2]Obsah tla\u010d\u00edtka[\/tlacitko2]<\/pre>\n<p>V\u00fdsledek: [tlacitko2]Obsah tla\u010d\u00edtka[\/tlacitko2]<\/p>\n<p>Jako posledn\u00ed vyu\u017eijeme prom\u011bnnou $attr, kterou jsme do funkce p\u0159idali v minul\u00e9m p\u0159\u00edkladu. Pomoc\u00ed t\u00e9to prom\u011bnn\u00e9 p\u0159id\u00e1me k buttonu t\u0159\u00eddu, pomoc\u00ed n\u00ed\u017e budeme m\u011bnit styly.<\/p>\n<p>Uprav\u00edme funkci<\/p>\n<pre lang=\"php\">function nase_tlacitko3($attr,$content = null){\nextract(shortcode_atts(array(\n\t\t'color'      =&gt; 'grey',\n\t\t), $attr));\n$out = '&lt;button class=\"'.$color.'\"&gt;'.<button class=\"tlacitko '.$color.'\">do_shortcode($content).'&lt;\/button&gt;<\/button>';\n    return $out;\n}\n\nadd_shortcode('tlacitko3','nase_tlacitko3');<\/pre>\n<p>Vytvo\u0159\u00edme si styly pro tla\u010d\u00edtko<\/p>\n<pre lang=\"html\">.tlacitko {\nwidth:200px;\nheight: 35px;\npadding: 10px 20px 10px 20px;\nmargin: 0px 0px 20px 0px;\ntext-align:center;\nfont-size: 14px;\nline-height: 18px;\nfont-weight: bold;\nborder:none;\ntext-transform: uppercase;\n-webkit-border-radius: 8px;\n-moz-border-radius: 8px;\nborder-radius: 8px;\n-webkit-box-shadow: 0px 4px 2px 0px rgba(139, 42, 42, 1);\nbox-shadow: 0px 4px 2px 0px rgba(139, 42, 42, 1);\n}\n\n.cervena{background: #dc3c3c;}\n.sedy{background: #D2D2D2;}\n.modry{background: #1E5799;}<\/pre>\n<p>A nyn\u00ed pomoc\u00ed atributu m\u016f\u017eeme m\u011bnit barvu tla\u010d\u00edtka<\/p>\n<pre lang=\"html\">[tlacitko3 color=\"cervena\"]\u010cerven\u00e9 tla\u010d\u00edtko[\/tlacitko3]\n[tlacitko3 color=\"modry\"]Modr\u00e9 tla\u010d\u00edtko[\/tlacitko3]\n[tlacitko3 color=\"sedy\"]\u0160ed\u00e9 tla\u010d\u00edtko[\/tlacitko3]<\/pre>\n<p>[tlacitko3 color=&#8220;cervena&#8220;]\u010cerven\u00e9 tla\u010d\u00edtko[\/tlacitko3]<br \/>\n[tlacitko3 color=&#8220;modry&#8220;]Modr\u00e9 tla\u010d\u00edtko[\/tlacitko3]<br \/>\n[tlacitko3 color=&#8220;sedy&#8220;]\u0160ed\u00e9 tla\u010d\u00edtko[\/tlacitko3]<\/p>\n<p>Pokud si p\u0159iprav\u00edme v\u00edce styl\u016f, m\u016f\u017eeme m\u00edt tolik variant, kolik budeme pot\u0159ebovat.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Drtiv\u00e1 v\u011bt\u0161ina premium \u0161ablon obsahuje mno\u017estv\u00ed shortc\u00f3d\u016f, kter\u00e9 usnad\u0148uj\u00ed pr\u00e1ci s obsahem ve wordpressu. Shortc\u00f3d je zkr\u00e1cen\u00fd z\u00e1pis podobn\u00fd bbcode, kter\u00fd vlo\u017e\u00edme do p\u0159\u00edsp\u011bvku, nebo widgetu a syst\u00e9m d\u00edky tomu zavol\u00e1 ji\u017e p\u0159ipravenou funkci. N\u011bkter\u00e9 shortc\u00f3dy umo\u017e\u0148uj\u00ed vkl\u00e1d\u00e1n\u00ed i cel\u00fdch v\u00fdstup\u016f z plugin\u016f. Jak vytvo\u0159it vlastn\u00ed shortcode tla\u010d\u00edtko 1. Vlastn\u00ed funkce Do souboru function zap\u00ed\u0161eme<\/p>\n","protected":false},"author":1,"featured_media":8624,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,30],"tags":[],"class_list":["post-9798","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-navody","category-wordpress"],"_links":{"self":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/9798"}],"collection":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/comments?post=9798"}],"version-history":[{"count":0,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/9798\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media\/8624"}],"wp:attachment":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media?parent=9798"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/categories?post=9798"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/tags?post=9798"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}