{"id":1867,"date":"2024-08-19T07:56:15","date_gmt":"2024-08-19T05:56:15","guid":{"rendered":"https:\/\/asgru.com\/?p=1867"},"modified":"2026-09-14T02:50:27","modified_gmt":"2026-09-14T00:50:27","slug":"todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala","status":"publish","type":"post","link":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/","title":{"rendered":"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca"},"content":{"rendered":"\n

Ar \u0161o praktisko materi\u0101lu s\u0113riju v\u0113los jums par\u0101d\u012bt, cik t\u0101lu ir att\u012bst\u012bjusies WordPress izstr\u0101de. 2024. gad\u0101 WordPress izstr\u0101d\u0101t\u0101js galvenok\u0101rt ir frontend izstr\u0101d\u0101t\u0101js, kuram ir j\u0101b\u016bt lab\u0101m HTML\/CSS, React un WordPress specifikas zin\u0101\u0161an\u0101m, k\u0101 ar\u012b j\u0101prot PHP, lai patst\u0101v\u012bgi izstr\u0101d\u0101tu veidojamo bloku aizmugursist\u0113mu. Atz\u012bstiet, j\u016bs dom\u0101j\u0101t, ka tas ir tikai par pogu spie\u0161anu Elementor, vai ne? \ud83d\ude42<\/p>\n\n\n\n

WordPress bloku redaktors (Gutenberg) ir b\u016btiski p\u0101rveidojis satura veido\u0161anas un redi\u0123\u0113\u0161anas procesu WordPress vietn\u0113s, nodro\u0161inot izstr\u0101d\u0101t\u0101jiem jaud\u012bgus r\u012bkus piel\u0101gojamu un funkcion\u0101lu bloku izveidei. \u0160aj\u0101 ce\u013cved\u012b izveidosim savu “Todo-List” komponentu, kas lietot\u0101jiem \u013cauj veidot uzdevumu sarakstus un nos\u016bt\u012bt datus uz serveri, kad main\u0101s uzdevumu statuss.<\/p>\n\n\n\n

Bloka pamatelementi<\/h3>\n\n\n\n

M\u016bsu izveidotais bloks sast\u0101v\u0113s no vair\u0101kiem galvenajiem elementiem:<\/p>\n\n\n\n

    \n
  1. RichText<\/strong>: komponents, kas lietot\u0101jiem \u013cauj ievad\u012bt un redi\u0123\u0113t tekstu blok\u0101.<\/li>\n\n\n\n
  2. InspectorControls<\/strong>: panelis, kas redaktor\u0101 nodro\u0161ina bloka iestat\u012bjumus un vad\u012bklas.<\/li>\n\n\n\n
  3. CheckboxControl<\/strong>: vad\u012bbas elements, ko izmanto, lai atz\u012bm\u0113tu uzdevumus k\u0101 izpild\u012btus.<\/li>\n\n\n\n
  4. useState<\/strong>: \u0101\u0137is, kas p\u0101rvalda uzdevumu st\u0101vokli blok\u0101.<\/li>\n\n\n\n
  5. fetch API<\/strong>: tiek izmantots uzdevumu datu nos\u016bt\u012b\u0161anai uz serveri.<\/li>\n<\/ol>\n\n\n\n

    Katrs bloks tiek izveidots k\u0101 atsevi\u0161\u0137s spraudnis, ko var atk\u0101rtoti izmantot citos WordPress projektos. Tas \u013cauj viegli integr\u0113t izveidoto bloku jebkur\u0101 cit\u0101 vietn\u0113, kas darbojas ar WordPress.<\/p>\n\n\n\n

    Izstr\u0101des vides iestat\u012b\u0161ana<\/h3>\n\n\n\n

    Pirms s\u0101kam veidot komponentu, ir svar\u012bgi p\u0101rliecin\u0101ties, ka j\u016bsu izstr\u0101des vide ir pareizi iestat\u012bta. Bloka izstr\u0101dei b\u016bs nepiecie\u0161ami \u0161\u0101di r\u012bki:<\/p>\n\n\n\n

      \n
    1. WordPress<\/strong>: p\u0101rliecinieties, ka j\u016bsu WordPress versija ir 5.0 vai jaun\u0101ka, jo \u0161aj\u0101 versij\u0101 tika ieviests bloku redaktors.<\/li>\n\n\n\n
    2. Node.js un npm<\/strong>: nepiecie\u0161ami darbam ar JavaScript un atkar\u012bbu p\u0101rvald\u012bbai.<\/li>\n\n\n\n
    3. WP-CLI<\/strong> (p\u0113c izv\u0113les): komandrindas r\u012bks darbam ar WordPress, kas var vienk\u0101r\u0161ot izstr\u0101di.<\/li>\n<\/ol>\n\n\n\n

      Node.js un npm instal\u0113\u0161ana<\/h3>\n\n\n\n

      Ja Node.js un npm v\u0113l nav instal\u0113ti j\u016bsu dator\u0101, lejupiel\u0101d\u0113jiet un instal\u0113jiet tos no ofici\u0101l\u0101s Node.js vietnes.<\/p>\n\n\n\n

      P\u0113c instal\u0113\u0161anas palaidiet \u0161\u0101das komandas, lai p\u0101rliecin\u0101tos, ka viss ir instal\u0113ts pareizi:<\/p>\n\n\n\n

      node -v\nnpm -v<\/code><\/pre>\n\n\n\n
      Ja komandas atgrie\u017e versiju numurus, viss darbojas pareizi.<\/p>\n\n\n\n
      Todo-List bloka izveide<\/h3>\n\n\n\n
      Lai pa\u0101trin\u0101tu bloka izveides procesu, varat izmantot komandu, kas autom\u0101tiski \u0123ener\u0113s visu projekta strukt\u016bru, tostarp konfigur\u0101cijas un failus.<\/p>\n\n\n\n
      1. solis: bloka izveide ar komandu<\/h3>\n\n\n\n
      Atveriet termin\u0101li un palaidiet \u0161\u0101du komandu, lai autom\u0101tiski izveidotu “Todo-List” bloku:<\/p>\n\n\n\n
      npx @wordpress\/create-block@latest todo-list<\/code><\/pre>\n\n\n\n
      \u0160\u012b komanda j\u016bsu viet\u0101 veiks \u0161\u0101das darb\u012bbas:<\/p>\n\n\n\n
        \n
      1. Projekta inicializ\u0101cija:<\/strong> komanda izveidos jaunu direktoriju ar nosaukumu\u00a0todo-list, kur\u0101 b\u016bs visi blokam nepiecie\u0161amie faili un strukt\u016bra.<\/li>\n\n\n\n
      2. Atkar\u012bbu instal\u0113\u0161ana:<\/strong> visas nepiecie\u0161am\u0101s pakotnes, piem\u0113ram,\u00a0@wordpress\/scripts, tiks instal\u0113tas autom\u0101tiski.<\/li>\n\n\n\n
      3. Failu strukt\u016bras izveide:<\/strong> strukt\u016br\u0101 b\u016bs mapes\u00a0src\u00a0un\u00a0build, k\u0101 ar\u012b\u00a0index.js\u00a0fails ar bloka pamatkodu.<\/li>\n\n\n\n
      4. Iestat\u012b\u0161ana <\/strong>block.json:\u00a0\u0161is fails tiks izveidots ar pamatkonfigur\u0101ciju, kas defin\u0113 “Todo-List” bloku.<\/li>\n<\/ol>\n\n\n\n
        Failu strukt\u016bra un apraksts<\/h3>\n\n\n\n
        P\u0113c komandas palai\u0161anas tiks izveidota \u0161\u0101da projekta strukt\u016bra:<\/p>\n\n\n\n
        todo-list\/\n\u2502\n\u251c\u2500\u2500 src\/\n\u2502   \u2514\u2500\u2500 index.js\n\u2502\n\u251c\u2500\u2500 build\/\n\u2502\n\u251c\u2500\u2500 block.json\n\u251c\u2500\u2500 package.json\n\u2514\u2500\u2500 README.md<\/code><\/pre>\n\n\n\n
        1. src\/index.js<\/h3>\n\n\n\n
        Fails index.js map\u0113 src satur visu j\u016bsu bloka pirmkodu. \u0160eit tiek \u012bstenota bloka lo\u0123ika, tostarp t\u0101 izskats un mijiedarb\u012bba ar lietot\u0101ju. Galven\u0101s koda da\u013cas ietver bloka re\u0123istr\u0113\u0161anu, izmantojot funkciju registerBlockType, atrib\u016btu iestat\u012b\u0161anu un bloka redi\u0123\u0113\u0161anas un saglab\u0101\u0161anas funkciju defin\u0113\u0161anu.<\/p>\n\n\n\n
         index.js satura paraugs:<\/p>\n\n\n\n
        import { registerBlockType } from '@wordpress\/blocks';\nimport { useState } from '@wordpress\/element';\nimport { RichText, InspectorControls } from '@wordpress\/block-editor';\nimport { PanelBody, CheckboxControl } from '@wordpress\/components';\n\nregisterBlockType('todo-plugin\/todo-list', {\n    title: 'Todo List',\n    icon: 'list-view',\n    category: 'widgets',\n    attributes: {\n        tasks: {\n            type: 'array',\n            default: [],\n        },\n    },\n    edit({ attributes, setAttributes }) {\n        const { tasks } = attributes;\n        const [taskText, setTaskText] = useState('');\n\n        const addTask = () => {\n            if (taskText) {\n                const newTasks = [...tasks, { text: taskText, done: false }];\n                setAttributes({ tasks: newTasks });\n                setTaskText('');\n                sendTasksToServer(newTasks);\n            }\n        };\n\n        const toggleTaskDone = (index) => {\n            const newTasks = tasks.map((task, i) =>\n                i === index ? { ...task, done: !task.done } : task\n            );\n            setAttributes({ tasks: newTasks });\n            sendTasksToServer(newTasks);\n        };\n\n        const sendTasksToServer = (tasks) => {\n            \/\/ Example of sending data to the server\n            fetch('\/wp-json\/todo\/v1\/update', {\n                method: 'POST',\n                headers: {\n                    'Content-Type': 'application\/json',\n                },\n                body: JSON.stringify({ tasks }),\n            });\n        };\n\n        return (\n            <div>\n                <InspectorControls>\n                    <PanelBody title=\"Tasks\">\n                        {tasks.map((task, index) => (\n                            <CheckboxControl\n                                key={index}\n                                label={task.text}\n                                checked={task.done}\n                                onChange={() => toggleTaskDone(index)}\n                            \/>\n                        ))}\n                    <\/PanelBody>\n                <\/InspectorControls>\n                <div>\n                    <RichText\n                        tagName=\"p\"\n                        value={taskText}\n                        onChange={(text) => setTaskText(text)}\n                        placeholder=\"Enter new task\"\n                    \/>\n                    <button onClick={addTask}>Add Task<\/button>\n                <\/div>\n                <ul>\n                    {tasks.map((task, index) => (\n                        <li key={index}>\n                            <CheckboxControl\n                                label={task.text}\n                                checked={task.done}\n                                onChange={() => toggleTaskDone(index)}\n                            \/>\n                        <\/li>\n                    ))}\n                <\/ul>\n            <\/div>\n        );\n    },\n    save({ attributes }) {\n        const { tasks } = attributes;\n\n        return (\n            <ul>\n                {tasks.map((task, index) => (\n                    <li key={index}>\n                        <RichText.Content\n                            tagName=\"span\"\n                            value={task.text}\n                            style={{ textDecoration: task.done ? 'line-through' : 'none' }}\n                        \/>\n                    <\/li>\n                ))}\n            <\/ul>\n        );\n    },\n});<\/code><\/pre>\n\n\n\n
        2.\u00a0build<\/h3>\n\n\n\n
        Mape build ir paredz\u0113ta kompil\u0113to failu glab\u0101\u0161anai. P\u0113c projekta b\u016bv\u0113\u0161anas ar komandu npm run build \u0161aj\u0101 map\u0113 tiks ievietots lieto\u0161anai gatavs index.js fails, ko WordPress izmantos bloka att\u0113lo\u0161anai un darb\u012bbai.<\/p>\n\n\n\n
        3. block.json<\/h3>\n\n\n\n
        Fails block.json satur j\u016bsu bloka metadatus. Tas defin\u0113 bloka nosaukumu, kategoriju, ikonu, skriptus un t\u0101 darb\u012bbai nepiecie\u0161amos stilus. \u0160is fails ir b\u016btisks bloka re\u0123istr\u0113\u0161anai WordPress.<\/p>\n\n\n\n
         block.json satura paraugs:<\/p>\n\n\n\n
        {\n  \"apiVersion\": 2,\n  \"name\": \"todo-plugin\/todo-list\",\n  \"title\": \"Todo List\",\n  \"category\": \"widgets\",\n  \"icon\": \"list-view\",\n  \"description\": \"A customizable todo list block.\",\n  \"keywords\": [ \"todo\", \"tasks\", \"list\" ],\n  \"version\": \"1.0.0\",\n  \"textdomain\": \"todo-list\",\n  \"editorScript\": \"file:.\/build\/index.js\"\n}<\/code><\/pre>\n\n\n\n
        4. package.json<\/h3>\n\n\n\n
        Fails package.json satur inform\u0101ciju par projektu un t\u0101 atkar\u012bb\u0101m. Tas p\u0101rvalda bloka izstr\u0101dei un b\u016bv\u0113\u0161anai nepiecie\u0161amo pakot\u0146u instal\u0113\u0161anu un izmanto\u0161anu. \u0160is fails tiek autom\u0101tiski izveidots projekta inicializ\u0101cijas laik\u0101 un tiek atjaunin\u0101ts, pievienojot jaunas atkar\u012bbas.<\/p>\n\n\n\n
         package.json satura paraugs:<\/p>\n\n\n\n
        {\n  \"name\": \"todo-list\",\n  \"version\": \"1.0.0\",\n  \"description\": \"A custom block for todo list\",\n  \"scripts\": {\n    \"build\": \"wp-scripts build\",\n    \"start\": \"wp-scripts start\"\n  },\n  \"devDependencies\": {\n    \"@wordpress\/scripts\": \"^24.0.0\"\n  }\n}<\/code><\/pre>\n\n\n\n
        5. README.md<\/h3>\n\n\n\n
        Fails README.md satur projekta aprakstu, instal\u0113\u0161anas un lieto\u0161anas nor\u0101d\u012bjumus, k\u0101 ar\u012b citu svar\u012bgu inform\u0101ciju, kas var b\u016bt nepiecie\u0161ama izstr\u0101d\u0101t\u0101jiem vai lietot\u0101jiem. \u0160is fails ir noder\u012bgs projekta dokument\u0113\u0161anai.<\/p>\n\n\n\n
        Projekta b\u016bv\u0113\u0161ana<\/h3>\n\n\n\n
        P\u0113c koda izmai\u0146u veik\u0161anas uzb\u016bv\u0113jiet projektu, lai ieg\u016btu lieto\u0161anai gatavu failu WordPress:<\/p>\n\n\n\n
        npm run build<\/pre>\n\n\n\n
        Komanda build kompil\u0113s j\u016bsu kodu un ievietos to map\u0113 build.<\/p>\n\n\n\n
        Bloka re\u0123istr\u0113\u0161ana WordPress<\/h3>\n\n\n\n
        Tagad, kad bloks ir gatavs, tas ir j\u0101re\u0123istr\u0113 WordPress. Lai to izdar\u012btu, pievienojiet savam spraud\u0146a vai mot\u012bva failam \u0161\u0101du kodu:<\/p>\n\n\n\n
        function todo_plugin_register_block() {\n    wp_register_script(\n        'todo-list-editor-script',\n        plugins_url( 'build\/index.js', __FILE__ ),\n        array( 'wp-blocks', 'wp-element', 'wp-editor' ),\n        filemtime( plugin_dir_path( __FILE__ ) . 'build\/index.js' )\n    );\n\n    register_block_type( 'todo-plugin\/todo-list', array(\n        'editor_script' => 'todo-list-editor-script',\n    ) );\n}\nadd_action( 'init', 'todo_plugin_register_block' );<\/code><\/pre>\n\n\n\n
        \u0160is kods re\u0123istr\u0113s j\u016bsu bloku WordPress un iek\u013caus kompil\u0113to JavaScript failu.<\/p>\n\n\n\n
        Secin\u0101jums<\/h3>\n\n\n\n
        Komandas npx @wordpress\/create-block@latest izmanto\u0161ana b\u016btiski pa\u0101trina jauna bloka izveides procesu WordPress bloku redaktoram. \u0160aj\u0101 ce\u013cved\u012b apskat\u012bj\u0101m, k\u0101 izveidot “Todo-List” bloku, kas lietot\u0101jiem \u013cauj veidot uzdevumu sarakstus un p\u0101rvald\u012bt to izpildi, nos\u016btot datus uz serveri. \u0160o komponentu var papla\u0161in\u0101t, pievienojot jaunas funkcijas un uzlabojot mijiedarb\u012bbu ar lietot\u0101ju, paverot pla\u0161as iesp\u0113jas WordPress vietnes piel\u0101go\u0161anai.<\/p>\n","protected":false},"excerpt":{"rendered":"
        Ar \u0161o praktisko materi\u0101lu s\u0113riju v\u0113los jums par\u0101d\u012bt, cik t\u0101lu ir att\u012bst\u012bjusies WordPress izstr\u0101de. 2024. gad\u0101 WordPress izstr\u0101d\u0101t\u0101js galvenok\u0101rt ir frontend izstr\u0101d\u0101t\u0101js, kuram ir j\u0101b\u016bt lab\u0101m HTML\/CSS, React un WordPress specifikas zin\u0101\u0161an\u0101m, k\u0101 ar\u012b j\u0101prot PHP, lai patst\u0101v\u012bgi izstr\u0101d\u0101tu veidojamo bloku aizmugursist\u0113mu. Atz\u012bstiet, j\u016bs dom\u0101j\u0101t, ka tas ir tikai par pogu spie\u0161anu Elementor, vai ne? […]<\/p>\n","protected":false},"author":1,"featured_media":908,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1867","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized"],"acf":[],"yoast_head":"\nTodo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca - asgru<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/\" \/>\n<meta property=\"og:locale\" content=\"lv_LV\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca - asgru\" \/>\n<meta property=\"og:description\" content=\"Ar \u0161o praktisko materi\u0101lu s\u0113riju v\u0113los jums par\u0101d\u012bt, cik t\u0101lu ir att\u012bst\u012bjusies WordPress izstr\u0101de. 2024. gad\u0101 WordPress izstr\u0101d\u0101t\u0101js galvenok\u0101rt ir frontend izstr\u0101d\u0101t\u0101js, kuram ir j\u0101b\u016bt lab\u0101m HTML\/CSS, React un WordPress specifikas zin\u0101\u0161an\u0101m, k\u0101 ar\u012b j\u0101prot PHP, lai patst\u0101v\u012bgi izstr\u0101d\u0101tu veidojamo bloku aizmugursist\u0113mu. Atz\u012bstiet, j\u016bs dom\u0101j\u0101t, ka tas ir tikai par pogu spie\u0161anu Elementor, vai ne? […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/\" \/>\n<meta property=\"og:site_name\" content=\"asgru\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/asgru.wp\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-08-19T05:56:15+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-14T00:50:27+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/asgru.com\/wp-content\/uploads\/2024\/08\/to-do-scaled.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2560\" \/>\n\t<meta property=\"og:image:height\" content=\"1186\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"asgru\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@ArtemKondranin\" \/>\n<meta name=\"twitter:site\" content=\"@ArtemKondranin\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"asgru\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/\"},\"author\":{\"name\":\"asgru\",\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/#\\\/schema\\\/person\\\/8f6cca385f5ae3eb7802b1e40b721576\"},\"headline\":\"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca\",\"datePublished\":\"2024-08-19T05:56:15+00:00\",\"dateModified\":\"2026-09-14T00:50:27+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/\"},\"wordCount\":977,\"publisher\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/asgru.com\\\/wp-content\\\/uploads\\\/2024\\\/08\\\/to-do-scaled.png\",\"inLanguage\":\"lv-LV\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/\",\"url\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/\",\"name\":\"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca - asgru\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/asgru.com\\\/wp-content\\\/uploads\\\/2024\\\/08\\\/to-do-scaled.png\",\"datePublished\":\"2024-08-19T05:56:15+00:00\",\"dateModified\":\"2026-09-14T00:50:27+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/#breadcrumb\"},\"inLanguage\":\"lv-LV\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"lv-LV\",\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/#primaryimage\",\"url\":\"https:\\\/\\\/asgru.com\\\/wp-content\\\/uploads\\\/2024\\\/08\\\/to-do-scaled.png\",\"contentUrl\":\"https:\\\/\\\/asgru.com\\\/wp-content\\\/uploads\\\/2024\\\/08\\\/to-do-scaled.png\",\"width\":2560,\"height\":1186},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/asgru.com\\\/lv\\\/home\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/#website\",\"url\":\"https:\\\/\\\/asgru.com\\\/lv\\\/\",\"name\":\"asgru\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/asgru.com\\\/lv\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"lv-LV\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/#organization\",\"name\":\"asgru\",\"url\":\"https:\\\/\\\/asgru.com\\\/lv\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"lv-LV\",\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/asgru.com\\\/wp-content\\\/uploads\\\/2025\\\/06\\\/logo-black.svg\",\"contentUrl\":\"https:\\\/\\\/asgru.com\\\/wp-content\\\/uploads\\\/2025\\\/06\\\/logo-black.svg\",\"caption\":\"asgru\"},\"image\":{\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/asgru.wp\\\/\",\"https:\\\/\\\/x.com\\\/ArtemKondranin\",\"https:\\\/\\\/www.linkedin.com\\\/in\\\/asgru\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/asgru.com\\\/lv\\\/#\\\/schema\\\/person\\\/8f6cca385f5ae3eb7802b1e40b721576\",\"name\":\"asgru\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"lv-LV\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/8226b63c28c55f65ad493c4aacf00e751309b5d3005e6aef331fd48ac864080d?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/8226b63c28c55f65ad493c4aacf00e751309b5d3005e6aef331fd48ac864080d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/8226b63c28c55f65ad493c4aacf00e751309b5d3005e6aef331fd48ac864080d?s=96&d=mm&r=g\",\"caption\":\"asgru\"},\"sameAs\":[\"http:\\\/\\\/asgru.loc\"],\"url\":\"https:\\\/\\\/asgru.com\\\/lv\\\/author\\\/asgru\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca - asgru","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/","og_locale":"lv_LV","og_type":"article","og_title":"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca - asgru","og_description":"Ar \u0161o praktisko materi\u0101lu s\u0113riju v\u0113los jums par\u0101d\u012bt, cik t\u0101lu ir att\u012bst\u012bjusies WordPress izstr\u0101de. 2024. gad\u0101 WordPress izstr\u0101d\u0101t\u0101js galvenok\u0101rt ir frontend izstr\u0101d\u0101t\u0101js, kuram ir j\u0101b\u016bt lab\u0101m HTML\/CSS, React un WordPress specifikas zin\u0101\u0161an\u0101m, k\u0101 ar\u012b j\u0101prot PHP, lai patst\u0101v\u012bgi izstr\u0101d\u0101tu veidojamo bloku aizmugursist\u0113mu. Atz\u012bstiet, j\u016bs dom\u0101j\u0101t, ka tas ir tikai par pogu spie\u0161anu Elementor, vai ne? […]","og_url":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/","og_site_name":"asgru","article_publisher":"https:\/\/www.facebook.com\/asgru.wp\/","article_published_time":"2024-08-19T05:56:15+00:00","article_modified_time":"2026-09-14T00:50:27+00:00","og_image":[{"width":2560,"height":1186,"url":"https:\/\/asgru.com\/wp-content\/uploads\/2024\/08\/to-do-scaled.png","type":"image\/png"}],"author":"asgru","twitter_card":"summary_large_image","twitter_creator":"@ArtemKondranin","twitter_site":"@ArtemKondranin","twitter_misc":{"Written by":"asgru","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/#article","isPartOf":{"@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/"},"author":{"name":"asgru","@id":"https:\/\/asgru.com\/lv\/#\/schema\/person\/8f6cca385f5ae3eb7802b1e40b721576"},"headline":"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca","datePublished":"2024-08-19T05:56:15+00:00","dateModified":"2026-09-14T00:50:27+00:00","mainEntityOfPage":{"@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/"},"wordCount":977,"publisher":{"@id":"https:\/\/asgru.com\/lv\/#organization"},"image":{"@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/#primaryimage"},"thumbnailUrl":"https:\/\/asgru.com\/wp-content\/uploads\/2024\/08\/to-do-scaled.png","inLanguage":"lv-LV"},{"@type":"WebPage","@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/","url":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/","name":"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca - asgru","isPartOf":{"@id":"https:\/\/asgru.com\/lv\/#website"},"primaryImageOfPage":{"@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/#primaryimage"},"image":{"@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/#primaryimage"},"thumbnailUrl":"https:\/\/asgru.com\/wp-content\/uploads\/2024\/08\/to-do-scaled.png","datePublished":"2024-08-19T05:56:15+00:00","dateModified":"2026-09-14T00:50:27+00:00","breadcrumb":{"@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/#breadcrumb"},"inLanguage":"lv-LV","potentialAction":[{"@type":"ReadAction","target":["https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/"]}]},{"@type":"ImageObject","inLanguage":"lv-LV","@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/#primaryimage","url":"https:\/\/asgru.com\/wp-content\/uploads\/2024\/08\/to-do-scaled.png","contentUrl":"https:\/\/asgru.com\/wp-content\/uploads\/2024\/08\/to-do-scaled.png","width":2560,"height":1186},{"@type":"BreadcrumbList","@id":"https:\/\/asgru.com\/lv\/todo-list-komponenta-izveide-wordpress-bloku-redaktoram-1-dala\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/asgru.com\/lv\/home\/"},{"@type":"ListItem","position":2,"name":"Todo-List komponenta izveide WordPress bloku redaktoram \u2014 1. da\u013ca"}]},{"@type":"WebSite","@id":"https:\/\/asgru.com\/lv\/#website","url":"https:\/\/asgru.com\/lv\/","name":"asgru","description":"","publisher":{"@id":"https:\/\/asgru.com\/lv\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/asgru.com\/lv\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"lv-LV"},{"@type":"Organization","@id":"https:\/\/asgru.com\/lv\/#organization","name":"asgru","url":"https:\/\/asgru.com\/lv\/","logo":{"@type":"ImageObject","inLanguage":"lv-LV","@id":"https:\/\/asgru.com\/lv\/#\/schema\/logo\/image\/","url":"https:\/\/asgru.com\/wp-content\/uploads\/2025\/06\/logo-black.svg","contentUrl":"https:\/\/asgru.com\/wp-content\/uploads\/2025\/06\/logo-black.svg","caption":"asgru"},"image":{"@id":"https:\/\/asgru.com\/lv\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/asgru.wp\/","https:\/\/x.com\/ArtemKondranin","https:\/\/www.linkedin.com\/in\/asgru\/"]},{"@type":"Person","@id":"https:\/\/asgru.com\/lv\/#\/schema\/person\/8f6cca385f5ae3eb7802b1e40b721576","name":"asgru","image":{"@type":"ImageObject","inLanguage":"lv-LV","@id":"https:\/\/secure.gravatar.com\/avatar\/8226b63c28c55f65ad493c4aacf00e751309b5d3005e6aef331fd48ac864080d?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/8226b63c28c55f65ad493c4aacf00e751309b5d3005e6aef331fd48ac864080d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/8226b63c28c55f65ad493c4aacf00e751309b5d3005e6aef331fd48ac864080d?s=96&d=mm&r=g","caption":"asgru"},"sameAs":["http:\/\/asgru.loc"],"url":"https:\/\/asgru.com\/lv\/author\/asgru\/"}]}},"_links":{"self":[{"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/posts\/1867","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/comments?post=1867"}],"version-history":[{"count":1,"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/posts\/1867\/revisions"}],"predecessor-version":[{"id":1868,"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/posts\/1867\/revisions\/1868"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/media\/908"}],"wp:attachment":[{"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/media?parent=1867"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/categories?post=1867"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/asgru.com\/lv\/wp-json\/wp\/v2\/tags?post=1867"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}