Kun aloin aloittaa t\u00e4m\u00e4n postauksen, aioin kirjoittaa jotain paljon enemm\u00e4n mukana kuin mit\u00e4 aion jakaa. Aluksi halusin k\u00e4yd\u00e4 l\u00e4pi yhden kahdesta asiasta:<\/p>\n
Ensimm\u00e4inen olisi keskitty\u00e4 moniin muihin asioihin, joista olen puhunut, sitoa ne kaikki yhteen ja saada lopullinen viittaus. Mutta t\u00e4m\u00e4 on asia, jonka kokoamiseen haluan k\u00e4ytt\u00e4\u00e4 aikaa varmistaakseni, ett\u00e4 se tehd\u00e4\u00e4n oikein.<\/p>\n
Toinen on mielest\u00e4ni t\u00e4rke\u00e4, mutta olen hieman siirtym\u00e4vaiheessa joidenkin omien ty\u00f6kalujeni kanssa. Ennen kuin se on tehty, en mieluummin kirjoita siit\u00e4.<\/p>\n
Silti aina on jotain peitett\u00e4v\u00e4\u00e4, eik\u00f6 niin? Joten t\u00e4n\u00e4\u00e4n olen valinnut jotain yksinkertaisempaa: luokkien, mallien ja osien k\u00e4yt\u00f6n erittely WordPress-laajennuksissa yksinkertaisen esimerkin avulla.<\/p>\n
T\u00e4m\u00e4n nimenomaisen aiheen kohdalla mieleen j\u00e4\u00e4v\u00e4 v\u00e4lit\u00f6n kysymys on yksinkertainen: Miksi vaivautua puhumaan t\u00e4st\u00e4?<\/p>\n
Koska on vuosi 2018 ja n\u00e4emme edelleen karkean yhdistelm\u00e4n PHP:t\u00e4, CSS:\u00e4\u00e4, merkint\u00f6j\u00e4 ja JavaScripti\u00e4 yhdess\u00e4 tiedostossa. T\u00e4m\u00e4 ei koske muita tekniikoita, jotka tekev\u00e4t t\u00e4m\u00e4n oletuksena (kuten React). Puhun erityisesti WordPress-laajennuksista ja yll\u00e4pidett\u00e4v\u00e4n koodin kirjoittamisesta siten, ett\u00e4 sit\u00e4 on [ilmeisesti] helppo yll\u00e4pit\u00e4\u00e4, kirjoittaa ja lukea.<\/p>\n
Oletetaan, ett\u00e4 ty\u00f6skentelet alivalikkosivulla jotain, joka tulee n\u00e4kyviin mukautetun valikon alle. Rekister\u00f6i sivusi<\/a> WordPress API:lla:<\/p>\n Mutta kun asetat takaisinsoittotoiminnon sivun n\u00e4ytt\u00e4miseen, et k\u00e4yt\u00e4<\/strong> toimintoa kaikkien eri kielten sekoittamiseen. Sen sijaan k\u00e4yt\u00e4t sit\u00e4 tiedoston sis\u00e4llytt\u00e4miseen.<\/a><\/strong><\/p>\n Huomaa, ett\u00e4 yll\u00e4 olevassa tiedostossa viittaan ominaisuuteen $this->pluginPath<\/strong>. T\u00e4m\u00e4 on asetettu luokan rakentajaan, jotta voin helposti k\u00e4ytt\u00e4\u00e4 laajennuksen juurta.<\/p>\n Joka tapauksessa, milt\u00e4 t\u00e4m\u00e4 tiedosto voi n\u00e4ytt\u00e4\u00e4?<\/p>\n T\u00e4ss\u00e4 tapauksessa oletan, ett\u00e4 mallisi on se, joka antaa tietoja k\u00e4ytt\u00e4j\u00e4lle ja pyyt\u00e4\u00e4 h\u00e4nen sy\u00f6tteit\u00e4\u00e4n. Osapuoli on vastuussa onnistumis-, virhe- tai varoitusviestin n\u00e4ytt\u00e4misest\u00e4 k\u00e4ytt\u00e4j\u00e4lle.<\/p>\n Yksinkertaisuuden vuoksi pid\u00e4n sek\u00e4 mallin ett\u00e4 osan mahdollisimman ohuena. T\u00e4ss\u00e4 tapauksessa oletetaan, ett\u00e4 aiomme hahmontaa sivun, pyyd\u00e4mme k\u00e4ytt\u00e4j\u00e4\u00e4 tallentamaan arvon, ja jos arvo tallentuu onnistuneesti (ja on siten wp_options<\/strong> – taulukossa), n\u00e4yt\u00e4mme onnistumisviestin.<\/p>\n T\u00e4m\u00e4 tarkoittaa:<\/p>\n Katso alla olevan mallin koodia:<\/a><\/strong><\/p>\n Huomaa, ett\u00e4 kyll\u00e4, siin\u00e4 on sy\u00f6tt\u00f6, tallennuspainike ja ei mit\u00e4\u00e4n, jotka kaikki ovat t\u00e4rkeit\u00e4 (mutta t\u00e4m\u00e4n viestin ulkopuolella) tietojen tallentamiseksi.<\/p>\n Mutta huomaa my\u00f6s, ett\u00e4 siin\u00e4 on aputoiminto, jonka avulla tarkistan onnistuneesti tallennettujen tietojen olemassaolon. T\u00e4m\u00e4 funktio sijaitsee samassa luokassa, joka vastaa mallin hahmontamisesta.<\/p>\n Se n\u00e4ytt\u00e4\u00e4 jotakuinkin t\u00e4lt\u00e4:<\/a><\/strong><\/p>\n<?php\n\npublic function addMenuPage()\n{\n add_menu_page(\n 'Acme Menu',\n 'Acme Menu',\n 'manage_options',\n 'acme-custom-menu',\n array($this, 'display'),\n 'dashicons-dashboard',\n 30\n );\n\n add_submenu_page(\n 'acme-custom-menu',\n 'Acme Menu',\n 'Acme Menu',\n 'Acme Menu',\n 'acme-custom-menu',\n array($this, 'display')\n );\n}\n<\/code><\/pre>\n<?php\n\npublic function display()\n{\n include_once $this->pluginPath. 'views\/acme-settings.php';\n}\n<\/code><\/pre>\nMalli ja osittainen<\/h3>\n
Malli<\/h4>\n
\n
<?php\n\/**\n * Renders the settings page for the plugin.\n *\/\n?>\n<div class=\"wrap\">\n <h1 class=\"wp-heading-inline\"><?php echo get_admin_page_title(); ?><\/h1>\n <?php if ($this->showSuccessMessage()) { ?>\n <?php include_once 'partials\/settings-saved.php'; ?>\n ?>\n <div id=\"acme-settings-schedule\">\n <form id=\"acme-form\" method=\"post\" action=\"<?php echo esc_html(admin_url('admin-post.php')); ?>\"\">\n <!-- This is where your settings go. -->\n <p>\n <?php\n submit_button(\n 'Save',\n 'primary',\n 'acme-save-settings',\n false\n );\n wp_nonce_field(\n 'acme-save',\n 'acme-save-nonce'\n );\n ?>\n <\/p>\n <\/form>\n <\/div>\n<\/div>\n<\/code><\/pre>\nOsittainen<\/h4>\n
<?php\n\npublic function showSuccessMessage()\n{\n return (false !== get_option('acme_custom_setting'));\n}\n<\/code><\/pre>\n