Mājas lapa » WordPress » Gutenberga Viss, kas jums jāzina par WordPress 'Jaunākais redaktors

    Gutenberga Viss, kas jums jāzina par WordPress 'Jaunākais redaktors

    Gutenberga ir jauns redaktors WordPress, kas būs pilnīgi nomainiet pašreizējo TinyMCE redaktoru. Tas ir vērienīgs projekts, kas, visticamāk, daudzos veidos mainīs WordPress un ietekmēs gan parastos gala lietotājus, gan izstrādātājus, īpaši tos, kuri ir atkarīgi no redaktora ekrāna, lai strādātu ar WordPress. Lūk, kā tas izskatās.

    Ir acīmredzams, ka tas ir iedvesmots no vidēja redaktora lietotāja interfeisa.

    Gutenberga arī ievieš jaunu paradigmu WordPress sauc “Bloķēt”.

    “Bloķēt” ir abstrakts termins, ko izmanto, lai aprakstītu atzīmes vienības kas sastāv no tīmekļa lapas satura vai izkārtojuma. Ideja apvieno koncepcijas par to, kas šodien ir sasniegts ar WordPress īsceļi, pielāgots HTML un iegultā atklāšana vienā saskaņotā API un lietotāju pieredzi.

    Projekta izveide

    Zinot, ka Gutenberga ir uzcelta uz React, daži izstrādātāji ir noraizējušies par to, ka barjera ir pārāk augsta sākuma līmeņa izstrādātājiem, lai attīstītu Gutenbergu.

    React.js iestatīšana varētu būt diezgan laikietilpīga un mulsinoša, ja jūs to tikai sākat. Jums būs nepieciešams vismaz, JSX transformators, Babel, atkarībā no jūsu koda, jums var būt nepieciešami daži Babel spraudņi un Bundler, piemēram, Webpack, Rollup vai Parcel.

    par laimi, daži cilvēki WordPress kopienā pastiprinājās un cenšas padarīt Gutenberga attīstību pēc iespējas vieglāku, lai ikviens varētu sekot. Šodien mums ir rīks, kas ģenerēs Gutenberga katlu mēs varam sākt rakstīt kodu uzreiz tā vietā, lai darbotos ar rīkiem un konfigurācijām.

    Izveidojiet Guten Block

    The izveidot-guten-block ir Ahmad Awais uzsāktais projekts. Tas ir nulles konfigurācijas rīku komplekts (# 0CJS), kas ļaus jums izveidot Gutenberga bloku ar dažiem moderniem stieņiem, ieskaitot React, Webpack, ESNext, Babel, ESLint un Sass. Sekojiet norādījumiem, lai sāktu darbu ar Guten Block izveidi.

    Izmantojot ES5 (ECMAScript 5)

    Izmantojot visus šos rīkus, lai izveidotu vienkāršu “Sveika pasaule” bloks varētu šķist pārāk daudz. Ja jūs vēlaties, lai jūsu kaudzītes būtu liesas, jūs faktiski varat izveidot Gutenberga bloku, izmantojot vienkāršu labo „ECMAScript 5”, kas jums jau varētu būt pazīstams. Ja Jums ir WP-CLI 1.5.0 ir instalēts jūsu datorā, jūs varat vienkārši palaist ...

     wp sastatņu bloks  [- virsraksts =] [- dashicon =<dashicon>] [- kategorija =<category>] [--theme] [- plugin =<plugin>] [- spēkā]</pre> <p>… Uz <strong>ģenerē Gutenberga bloku katlu uz jūsu spraudni vai tēmu</strong>. Šī pieeja ir saprātīgāka, jo īpaši attiecībā uz esošajiem spraudņiem un tēmām, kuras esat izstrādājis pirms Gutenberga laikmeta.</p> <p>Tā vietā, lai izveidotu jaunu spraudni, lai pielāgotos Gutenberga blokiem, iespējams, vēlēsities integrēt blokus savos spraudnēs vai tēmās. Un, lai šī apmācība būtu viegli ievērojama ikvienam, <strong>mēs izmantosim ECMAScript 5 ar WP-CLI</strong>.</p> <h4>Jauna bloka reģistrēšana</h4> <p>Gutenberga pašlaik tiek veidota kā spraudnis, un tā tiks apvienota ar WordPress 5.0, kad komanda uzskata, ka tā ir gatava. Tāpēc pagaidām jums būs jāinstalē no <strong>Spraudņu lapa <code>wp-admin</code></strong>. Kad esat instalējis un aktivizējis to, palaidiet šādu komandu Terminālā vai komandu uzvednē, ja atrodaties Windows datorā.</p> <pre name="code"> wp sastatņu bloka sērija --title = "HTML5 Series" - tēma</pre> <p>Šī komanda ģenerēs bloku pašreiz aktīvajai tēmai. Mūsu bloks sastāvēs no šādiem failiem:</p> <pre name="code"> . âÂ?¢Â?¢Â? sērija â       à ¢Â?¢Â?¢Â? block.js â       à ¢Â?¢Â?¢Â? editor.css â       à ¢Â?¢Â?¢Â? style.css âÂ?¢Â?¢Â? series.php </pre> <p>Ielādēsim mūsu bloku galveno failu <code>funkcijas.php</code> no mūsu tēmas:</p> <pre name="code"> ja (function_exists ('register_block_type')) nepieciešams get_template_directory (). '/blocks/series.php';  </pre> <p>Ievērojiet, ka pievienojam faila iekraušanu ar nosacījumu. Tas nodrošina <strong>saderība ar iepriekšējo WordPress versiju, ka mūsu bloks ir ielādēts tikai tad, kad atrodas Gutenberg</strong>. Tagad mūsu blokam jābūt pieejamam Gutenberg interfeisā.</p> <figure> <img src="//savtec.org/img/images/gutenberg-all-you-need-to-know-about-wordpress-latest-editor_2.jpg"></figure><p>Tas izskatās, kad ievietojam bloku.</p> <figure> <img src="//savtec.org/img/images/gutenberg-all-you-need-to-know-about-wordpress-latest-editor_3.jpg"></figure><h3>Gutenberga API</h3> <p>Gutenberga iepazīstina ar diviem API komplektiem, lai reģistrētu jaunu bloku. Ja mēs skatāmies uz <code>series.php</code>, mēs atradīsim šādu kodu, kas reģistrē mūsu jauno bloku. Tas arī <strong>ielādē stilu un JavaScripts priekšpusē un redaktorā</strong>.</p> <pre name="code">register_block_type ('twentyseventeen / series', masīvs ('editor_script' => 'series-block-editor', 'editor_style' => 'series-block-editor', 'style' => 'series-block',));</pre> <p>Kā redzams iepriekš, mūsu bloks ir nosaukts <code>twentyseventeen / series</code>, Bloka nosaukumam jābūt unikālam un nosaukumam, lai izvairītos no sadursmes ar citiem blokiem, ko ieved citi spraudņi.</p> <p>Turklāt, <strong>Gutenberga piedāvā jaunu JavaScript API komplektu, lai mijiedarbotos ar “Bloķēt” saskarne</strong> redaktorā. Tā kā API ir diezgan bagātīga, mēs koncentrēsimies uz dažām specifiku, kas, manuprāt, jums jāzina, lai iegūtu vienkāršu, tomēr funkcionējošu Gutenberga bloku.</p> <h4><code>wp.blocks.registerBlockType</code></h4> <p>Pirmkārt, mēs izskatīsim <code>wp.blocks.registerBlockType</code>. Šī funkcija tiek izmantota <strong>reģistrēt jaunu “Bloķēt” Gutenberga redaktoram</strong>. Tas prasa divus argumentus. Pirmais arguments ir bloka nosaukums, kam jāievēro reģistrētais nosaukums <code>register_block_type</code> funkcija PHP pusē. Otrais arguments ir <strong>Objekts, kas definē bloka īpašības</strong> piemēram, nosaukums, kategorija un pāris funkcijas, lai padarītu bloķēšanas interfeisu.</p> <pre name="code"> var registerBlockType = wp.blocks.registerBlockType; registerBlockType ('twentyseventeen / series', nosaukums: __ ('HTML5 Series'), kategorija: "logrīki", atslēgvārdi: ['html'], rediģēt: funkcija (rekvizīti) , saglabāt: funkcija (rekvizīti)  ); </pre> <h4><code>wp.element.createElement</code></h4> <p>Šī funkcija ļauj izveidot elementu “Bloķēt” ieraksta redaktorā. The <code>wp.element.createElement</code> funkcija būtībā ir reakcijas iegūšana <code>createElement ()</code> tādējādi tā pieņem to pašu argumentu kopumu. Pirmais arguments ņem vērā elementa veidu, piemēram, punktu, a <code>span</code>, vai a <code>div</code> kā parādīts zemāk:</p> <pre name="code">wp.element.createElement ('div');</pre> <p>Mēs varam <strong>pārvērst funkciju par mainīgo</strong> tāpēc tas ir īsāks. Piemēram:</p> <pre name="code"> var el = wp.element.createElement; el ('div');</pre> <p>Ja jūs <strong>dod priekšroku jaunajai ES6 sintaksei</strong>, jūs varat to darīt arī šādi:</p> <pre name="code"> const createElement: el = wp.element; el ('div');</pre> <p>Mēs varam arī <strong>pievienot elementa atribūtus</strong> piemēram, <code>klasē</code> nosaukums vai <code>ID</code> par otro parametru šādi:</p> <pre name="code"> var el = wp.element.createElement; el ('div', 'class': 'series-html5', 'id': 'series-html-post-id-001'));</pre> <p>The <code>div</code> mums nebūtu jēgas bez satura. Mēs varam <strong>pievienojiet saturu trešā parametra argumentam</strong>:</p> <pre name="code"> var el = wp.element.createElement; el ('p', 'class': 'series-html5', 'id': 'series-html-post-id-001'), 'Šis raksts ir daļa no mūsu "HTML5 / CSS3 apmācības sērijas" - veltīta lai palīdzētu jums kļūt par labāku dizaineru un / vai izstrādātāju. Noklikšķiniet šeit, lai redzētu vairāk rakstu no tās pašas sērijas ”);</pre> <h4><code>wp.components</code></h4> <p>The <code>wp.components</code> ietveriet Gutenberga komponentu kolekciju, kā norāda nosaukums. Šīs sastāvdaļas tehniski ir React custom komponenti, kas ietver pogu, Popover, Spinner, Tooltip un citu ķekars. Mēs varam <strong>atkārtoti izmantot šīs sastāvdaļas savā blokā</strong>. Nākamajā piemērā pievienojam pogu.</p> <pre name="code"> var Button = wp.components.Button; el (poga, 'class': 'download-button', ►, 'Download');</pre> <h4>Atribūti</h4> <p>Atribūti ir veids, kā saglabāt datus mūsu blokā, šie dati varētu būt, piemēram, saturs, krāsas, izlīdzinājumi, URL utt. Mēs varam iegūt atribūtus no īpašībām, kas nodotas <code>rediģēt ()</code> funkcijas:</p> <pre name="code"> rediģēt: funkcija (rekvizīti) var content = props.attributes.seriesContent; atgriezties el ('div', 'class': 'series-html5', 'id': 'series-html-post-id-001'), saturs); </pre> <p>Lai atjauninātu atribūtus, mēs izmantojam <code>setAttributes ()</code> funkciju. Parasti mēs mainām saturu noteiktās darbībās, piemēram, kad tiek noklikšķināta uz pogas, tiek ievadīts ievads, ir atlasīta opcija utt. Nākamajā piemērā mēs to izmantojam, lai pievienotu <strong>atkāpties</strong> mūsu bloka saturs, ja ar mums noticis kaut kas negaidīts <code>seriesContent</code> Atribūts.</p> <pre name="code"> rediģēt: funkcija (rekvizīti) if (type.attributes.seriesContent === 'undefined' ||! props.attributes.seriesContent) props.setAttribute (seriesContent: Hello World! Šeit ir rezerves saturs. ' ) var saturs = props.attributes.seriesContent; atgriezties [el ('div', 'class': 'series-html5', 'id': 'series-html-post-id-001'), saturs),];  </pre> <h4>Bloka saglabāšana</h4> <p>The <code>saglabāt ()</code> funkcija darbojas līdzīgi kā <code>rediģēt ()</code>, izņemot to, kas definē mūsu bloka saturu, lai saglabātu ziņu datubāzē. Bloķēšanas satura saglabāšana ir diezgan vienkārša, kā redzams tālāk:</p> <pre name="code"> saglabāt: funkcija (rekvizīti) ja (! rekvizīti ||! props.attributes.seriesContent) atpakaļ;  var saturs = props.attributes.seriesContent; atgriezties [el ('div', 'class': 'series-html5', 'id': 'series-html-post-id-001'), saturs),];  </pre> <h3>Ko tālāk?</h3> <p>Gutenberga mainīs WordPress ekosistēmu labākai (vai, iespējams, sliktākai). Tas ļauj izstrādātājiem <strong>pieņemt jaunu veidu, kā attīstīt WordPress spraudņus un tēmas</strong>. Gutenberga ir tikai sākums. Drīz “Bloķēt” paradigma tiks paplašināta arī citās WordPress jomās, piemēram, iestatījumu API un logrīki.</p> <p>Uzziniet JavaScript dziļi; tas ir vienīgais veids, kā nokļūt Gutenbergā un palikt atbilstošs nākotnei WordPress nozarē. Ja jūs jau esat iepazinušies ar JavaScript pamatiem, lietojumprogrammām, funkcijām, rīkiem, precēm un ļaunumiem, es tiešām esmu pārliecināts, ka ar Gutenbergu jūs saņemsiet ātrumu.</p> <p>Kā jau minēts, Gutenberga atklāj daudz API, kas ir pietiekami, lai gandrīz visu darītu jūsu blokā. Jūs varat izvēlēties, vai <strong>kodējiet savu bloku ar vienkāršu JavaScript, JavaScript ar ES6 sintaksi, React vai pat Vue</strong>.</p> <h4>Idejas un iedvesmas</h4> <p>Esmu izveidojis ļoti (ļoti) vienkāršu Gutenberga bloku, ko var atrast mūsu Github konta krātuvē. Turklāt es esmu arī apkopojis vairākus repozitorijus, no kuriem jūs varat vadīt iedvesmu, veidojot sarežģītāku bloku.</p> <ul><li>Gutenblocks - Mathieu Viet bloku kolekcija, kas rakstīta JavaScript ar ES5 sintaksi</li> <li>Jetpack Gutenblocks Project - Jetpack kolekcijā iekļauto bloku kolekcija</li> <li>Gutenberga ieviešanas piemēru saraksts, tostarp ar Vue.js</li> </ul><h3>Tālāka atsauce</h3> <ul><li>Gutenberga oficiālā repozitorija</li> <li>Gutenberga rokasgrāmata</li> </ul>
    
    
    			<div class="rek-block">
    				<center>
    						<ins class="adsbygoogle"
         style="display:block"
         data-ad-client="ca-pub-6284591903398394"
         data-ad-slot="6432271471"
         data-ad-format="auto"
         data-full-width-responsive="true"></ins>
    <script>
         (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
    				</center>
    			</div>
    
    		</div>
    	</div>
    
    	<div class="col-md-4">
    <div class="bar">
    
        <div class="rek-block">
            <center>
                    <ins class="adsbygoogle"
         style="display:block"
         data-ad-client="ca-pub-6284591903398394"
         data-ad-slot="6432271471"
         data-ad-format="auto"
         data-full-width-responsive="true"></ins>
    <script>
         (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
            </center>
        </div>
    
        
        <div class="barpost">
                <div class="bar-post-img"><a href="/articles/howto/hack-an-ikea-lack-table-into-a-component-rack.html"><img src="//savtec.org/img/images_8/hack-an-ikea-lack-table-into-a-component-rack_2.jpg" alt=""></a></div>
                <div class="bar-post-h1"> <a href="/articles/howto/hack-an-ikea-lack-table-into-a-component-rack.html">Ielauziet IKEA trūkuma tabulu komponentu plauktos</a> </div>
        </div>
        
    
        
        <div class="barpost">
                <div class="bar-post-img"><a href="/articles/howto/hack-apart-an-old-keyboard-to-create-custom-control-interface.html"><img src="//savtec.org/img/images_8/hack-apart-an-old-keyboard-to-create-custom-control-interface_2.jpg" alt=""></a></div>
                <div class="bar-post-h1"> <a href="/articles/howto/hack-apart-an-old-keyboard-to-create-custom-control-interface.html">Hack Apart veco tastatūru, lai izveidotu pielāgoto kontroles interfeisu</a> </div>
        </div>
        
    
        
        <div class="barpost">
                <div class="bar-post-img"><a href="/articles/windows/guide-to-windows-10-task-manager-part-ii.html"><img src="//savtec.org/img/images/guide-to-windows-10-task-manager-part-ii_2.png" alt=""></a></div>
                <div class="bar-post-h1"> <a href="/articles/windows/guide-to-windows-10-task-manager-part-ii.html">Windows 10 uzdevumu pārvaldnieka rokasgrāmata - II daļa</a> </div>
        </div>
        
            
    
    </div>
    	</div>
    
    </div>
    </div>
    
    <div class="prevnext">
    <div class="container">
    <div class="row">
    
    		<div class="col-md-6">
    			
    				<div class="post">
                            <div class="prevnext-title">Nākamais raksts</div>
    					<div class="post-img"><a href="/articles/howto/hack-a-10-flashlight-into-an-ultra-bright-premium-one.html">
    
    						
    						<img src="//savtec.org/img/images_9/hack-a-10-flashlight-into-an-ultra-bright-premium-one_2.jpg" alt="">
    						
    					
    					</a></div>
    					<div class="post-h1"> <a href="/articles/howto/hack-a-10-flashlight-into-an-ultra-bright-premium-one.html">Hack $ 10 zibspuldzi Ultra-Bright Premium One</a> </div>
    				</div>
    			
    			</div>
    
    
    			<div class="col-md-6">
    				
    					<div class="post">
                                <div class="prevnext-title">Iepriekšējais raksts</div>
    						<div class="post-img"><a href="/articles/windows/guide-to-windows-10-task-manager-part-iii.html">
    							
    								
    								<img src="//savtec.org/img/images/guide-to-windows-10-task-manager-part-iii.png" alt="">
    								
    						
    						</a></div>
    						<div class="post-h1"> <a href="/articles/windows/guide-to-windows-10-task-manager-part-iii.html">Windows 10 uzdevumu pārvaldnieka rokasgrāmata - III daļa</a> </div>
    					</div>
    				
    				</div>
    
    </div>
    </div>
    </div>
    
    
    <footer>
    	<div class="container">
        <div class="langs-block">
          <ul class="langs-list">
            <li class="site-lang"><a href="https://www.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-TH"></i></a></li>  
              <li class="site-lang"><a href="https://de.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-DE"></i></a></li>
              <li class="site-lang"><a href="https://ar.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-AE"></i></a></li>
              <li class="site-lang"><a href="https://bg.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-BG"></i></a></li>
              <li class="site-lang"><a href="https://cs.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-CZ"></i></a></li>
              <li class="site-lang"><a href="https://da.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-DK"></i></a></li>          
              <li class="site-lang"><a href="https://el.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-GR"></i></a></li>
              <li class="site-lang"><a href="https://es.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-ES"></i></a></li>
              <li class="site-lang"><a href="https://et.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-EE"></i></a></li>
              <li class="site-lang"><a href="https://fi.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-FI"></i></a></li>
              <li class="site-lang"><a href="https://fr.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-FR"></i></a></li>
              <li class="site-lang"><a href="https://he.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-IL"></i></a></li>
              <li class="site-lang"><a href="https://hi.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-IN"></i></a></li>
              <li class="site-lang"><a href="https://hr.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-HR"></i></a></li>
              <li class="site-lang"><a href="https://hu.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-HU"></i></a></li>
              <li class="site-lang"><a href="https://id.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-ID"></i></a></li>
              <li class="site-lang"><a href="https://it.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-IT"></i></a></li>
              <li class="site-lang"><a href="https://ja.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-JP"></i></a></li>
              <li class="site-lang"><a href="https://ko.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-KR"></i></a></li>
              <li class="site-lang"><a href="https://lt.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-LT"></i></a></li>
              <li class="site-lang"><a href="https://lv.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-LV"></i></a></li>
              <li class="site-lang"><a href="https://ms.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-MY"></i></a></li>
              <li class="site-lang"><a href="https://nl.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-NL"></i></a></li>
              <li class="site-lang"><a href="https://no.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-NO"></i></a></li>
              <li class="site-lang"><a href="https://pl.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-PL"></i></a></li>
              <li class="site-lang"><a href="https://pt.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-PT"></i></a></li>
              <li class="site-lang"><a href="https://ro.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-RO"></i></a></li>
              <li class="site-lang"><a href="https://ru.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-RU"></i></a></li>
              <li class="site-lang"><a href="https://sk.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-SK"></i></a></li>
              <li class="site-lang"><a href="https://sl.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-SI"></i></a></li>
              <li class="site-lang"><a href="https://sr.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-RS"></i></a></li>
              <li class="site-lang"><a href="https://sv.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-SE"></i></a></li>        
              <li class="site-lang"><a href="https://tr.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-TR"></i></a></li>
              <li class="site-lang"><a href="https://ua.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-UA"></i></a></li>
              <li class="site-lang"><a href="https://vi.savtec.org/articles/wordpress/gutenberg-all-you-need-to-know-about-wordpress-latest-editor.html"><i class="flag flag-VN"></i></a></li>          
    
          </ul>
        </div>
    	<div class="row align-items-center">
    		<div class="col-md-3">
    			© <script>
                        var currentTime = new Date();
                        var year = currentTime.getFullYear();
    
                        document.write(year);
                </script> <a href="/">Savtec</a>
    		</div>
    
    		<div class="col-md-9">
    			Noderīga informācija un tīmekļa attīstības padomi. Programmēšana, web dizains, CSS, HTML, JAVASCRIPT. Konfigurējiet un atkārtoti instalējiet Windows. Vietņu un lietojumprogrammu izveide no nulles.
    		</div>
    	</div>
     </div>
    </footer>
    
    <link rel="stylesheet" href="css/flags.css">
    
    <script src="https://unpkg.com/simple-jekyll-search@1.5.0/dest/simple-jekyll-search.min.js"></script>
    <script>
            SimpleJekyllSearch({
              searchInput: document.getElementById('search-input'),
              resultsContainer: document.getElementById('results-container'),
              json: '/search.json',
              searchResultTemplate: '<li><a href="{url}">{title}</a></li>'
            })
    </script>
    
    <link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.css" />
    <script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.js"></script>
    <script>
    window.addEventListener("load", function(){
    window.cookieconsent.initialise({
      "palette": {
        "popup": {
          "background": "#edeff5",
          "text": "#838391"
        },
        "button": {
          "background": "#4b81e8"
        }
      },
      "theme": "classic",
      "position": "bottom-right"
    })});
    </script>
    
    </body>
    </html>