{"id":231660,"date":"2023-01-10T12:25:00","date_gmt":"2023-01-10T09:25:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=231660"},"modified":"2022-12-25T18:56:37","modified_gmt":"2022-12-25T15:56:37","slug":"muutke-wordpressi-manustatud-saeutsud-tundlikuks","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/et\/muutke-wordpressi-manustatud-saeutsud-tundlikuks\/","title":{"rendered":"Muutke WordPressi manustatud s\u00e4utsud tundlikuks"},"content":{"rendered":"\n<p>WordPress v\u00f5imaldab teil s\u00e4utse manustada, kleepides s\u00e4utsu URL-i oma postitustesse. Saate kena kaardi s\u00e4utsu ja k\u00f5igi asjakohaste \u00fcksikasjadega. Kahjuks ei t\u00f6\u00f6ta see kaart tundlikel saitidel Twitteri paranduslaiuse t\u00f5ttu. Selles postituses n\u00e4eme, kuidas seda eemaldada ja ka meie manustatud s\u00e4uts korralikult reageerivaks muuta.<\/p>\n<h2>\u00dclevaade<\/h2>\n<p>Enne kui s\u00e4utsu t\u00f6\u00f6deldakse, et kuvada kaart koos autori, Twitteri avatari, j\u00e4lgimisnupu ja muude metaandmetega, kuvatakse see tavalise HTML-i blockquote elemendina, mille atribuudiks on m\u00e4\u00e4ratud fikseeritud laius, mis vaikimisi on 500 pikslit. Muidugi rikub see fikseeritud laius meie reageerivat paigutust, nii et p\u00f5him\u00f5tteliselt peame selle atribuudi eemaldama, et t\u00f6\u00f6deldud s\u00e4utsukaart ilmuks fikseeritud laiusega.<\/p>\n<p>P\u00e4rast selle eemaldamist rakendame lihtsat CSS-stiili, et see toimiks tundlikult ka \u00fclej\u00e4\u00e4nud saidi m\u00f5\u00f5tmetega.<\/p>\n<h2>WordPressi oEmbed ja filtrid<\/h2>\n<p>Meie s\u00e4uts on paigutatud oEmbedi abil, mis on WordPressi kasutatav tehnoloogia, mis v\u00f5imaldab meil sisestada teistelt saitidelt sisu, lihtsalt asetades lingi meie postituse redaktorisse. WordPress esitab automaatselt p\u00e4ringu teenusepakkuja saidilt (mis ei saa olla ainult Twitter, vaid ka YouTube, Vimeo ja teised) ning hankib HTML-i meie saidile sisestamiseks.<\/p>\n<p>Pakkuja saidi tagastatud HTML-i saab t\u00f6\u00f6delda \u00fche filtri abil, mille WordPress pakub selleks ja m\u00e4rgistuse muutmiseks. Kasutame filtrit <strong>oembed_result<\/strong>, mis k\u00e4ivitatakse p\u00e4rast HTML-i hankimist oEmbedi pakkujalt ja enne selle vahem\u00e4llu salvestamist. Selle eeliseks on see, et filtrit ei pea k\u00e4ivitama iga kord, kui saiti k\u00fclastate, mille tulemuseks on kiirem reageerimine ja loomulikult kiirem laadimisaeg.<\/p>\n<h2>S\u00e4utsu filtreerimine<\/h2>\n<p>See kood tuleks paigutada teie teema faili functions.php<\/p>\n<pre><code>&lt;?php\n\/** Remove fixed width from embedded tweets. First step to make them responsive. \n * @param string $html HTML that should be used to embed \n * @param string $url The URL to the content that should be attempted to be embedded. \n * @param array $args Optional arguments. \n * @author Elio Rivero \n * @link https:\/\/startfunction.com \n *\/ \nfunction startfunction_oembed_result($html, $url, $args)\n{\n    \/\/ Check if it's a tweet looking for 'twitter' in the url pasted in the post\n    if (stripos($url, 'twitter')) {\n        \/\/ Before the tweet is processed, it's displayed as a blockquote \/\/ with its width attribute set, so let's remove it. \n        return preg_replace('#width=\"(.*)\"#', '', $html);\n    }\n    \/\/ Otherwise return the HTML as is. \n    return $html;\n} \n\/\/ Filter the result of the oEmbed extraction. \nadd_filter('oembed_result', 'startfunction_oembed_result', 10, 3);\n<\/code><\/pre>\n<p>Parameeter <code>$url<\/code>on link meie manustatava s\u00e4utsu juurde. Kontrollime, kas see p\u00e4rineb Twitterist, sest muidu ei taha me seda k\u00e4ivitada. Kasutame str_replace&#8217;i stringi otsimiseks, mis <strong><code>width=\"500\"<\/code><\/strong>asendab selle t\u00fchja stringiga.<\/p>\n<h2>S\u00e4utsukaardi tundlikuks muutmine<\/h2>\n<p>Peame siiski lisama CSS-i, et see reageeriks, nii et sisestage oma teema (v\u00f5i pistikprogrammi) laadilehele j\u00e4rgmine tekst<\/p>\n<pre><code>#main .twitter-tweet-rendered, #main .twt-border {\n    max-width: 100% !important; \n}<\/code><\/pre>\n<p>ja just sellega reageerivad teie manustatud s\u00e4utsud.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/startfunction.com\" class=\"external external_icon\">startfunction.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>WordPress v\u00f5imaldab teil s\u00e4utse manustada, kleepides s\u00e4utsu URL-i oma postitustesse. Saate kena kaardi s\u00e4utsu ja k\u00f5igi asjakohaste \u00fcksikasjadega. Kahjuks see kaart<\/p>\n","protected":false},"author":1,"featured_media":236911,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[833,894,842,812,863],"tags":[1165],"class_list":["post-231660","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-juhend-algajatele","category-kood","category-opetused","category-pistikprogrammid","category-wordpress-4","tag-affiai-et"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/231660","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/comments?post=231660"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/231660\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media\/236911"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media?parent=231660"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/categories?post=231660"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/tags?post=231660"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}