Poradnik krok po kroku: Jak się robi stronę HTML dla początkujących

Cześć! Chcesz nauczyć się tworzyć swoją własną stronę HTML, ale nie wiesz, od czego zacząć? Świetnie trafiłeś! W tym poradniku krok po kroku pokażemy Ci, jak w prosty sposób stworzyć swoją pierwszą stronę HTML, nawet jeśli jesteś całkowitym początkującym. Bez zbędnego marudzenia, zabierzmy się do pracy!

Krok pierwszy: Poznaj podstawowe znaczniki HTML

Wiadomo, jak sie robi strone html trzeba najpierw poznać podstawowe klocki, z których będziemy “budować” naszą stronę. Są nimi znaczniki HTML, które posługują się charakterystycznymi nawiasami “<" oraz ">“. Pewnie byś się zapytał: ale co to są te znaczniki? Dobrze Cię zrozumieć, że chciałbyś wiedzieć jak się robi strone www za ich pomocą. Otóż, są to specjalne słowa oraz skróty, które pozwalają przeglądarce internetowej “zrozumieć”, jak powinna wyświetlać dane elementy na stronie.

Krok drugi: Stwórz pierwszy plik HTML

Teraz, gdy już rozumiemy to, co jest potrzebne, aby zacząć tworzyć własną stronę, spróbujmy stworzyć prosty plik HTML. Do tego celu wystarczy Ci zwykły edytor tekstu, taki jak Notatnik (Windows) lub TextEdit (macOS). Właściwie nic nie stoi na przeszkodzie, więcej to rzeczywiście tak się zaczynało, widzisz to? Jak sie robi strone html nie jest wcale takie trudne – przekonasz się o tym na własnej skórze!

Krok trzeci: Umieszczanie podstawowych znaczników w pliku HTML

Gdy masz już otwarty swój plik HTML w edytorze tekstu, wpisz następujące linijki kodu:

“`

Moja pierwsza strona

Witaj, świecie!

Teraz już wiem, jak się robi strone www!

“`

Spokojnie, bez paniki! Zostań jeszcze chwilę i spróbujmy razem zrozumieć, co tutaj się dzieje, bo przecież jak sie robi strony html to proces, który warto dobrze zrozumieć. Zaczynamy od deklaracji (), która informuje przeglądarkę, że jest to plik HTML5. Następnie mamy znacznik z atrybutem “lang” określającym język strony i otwieramy , gdzie umieszczamy znacznik definujący kodowanie tekstu oraz z tytułem strony. Potem przechodzimy do <body>, gdzie umieszczamy nasze treści, np. nagłówki (</p> <h2>) i akapity (</p> <p>).</p> <h3 id="krok-czwarty-dodawanie-grafik-i-linkow">Krok czwarty: Dodawanie grafik i linków</h3> <p>No dobrze, ale pewnie myślisz, że na swojej stronie chciałbyś mieć również jakieś grafiki, co nie? Więc teraz nauczmy się <b>jak sie tworzy strone html</b> z obrazkami i linkami do innych stron. Użyjemy do tego znacznika <img> z atrybutem “src” oraz <a> z atrybutem “href”. Przykładowo, dodajmy zdjęcie i link do naszego ulubionego serwisu informacyjnego:</p> <p>“`<br /> <img decoding="async" src="moje-zdjecie.jpg" alt="Opis zdjecia"></p> <p><a href="https://example.com" target="_blank" rel="noopener">Kliknij tutaj, aby odwiedzić moją ulubioną stronę</a></p> <p>“`</p> <p>Cudownie! Teraz Twoja strona powinna zawierać obrazek oraz link do przykładowego serwisu informacyjnego. Pamiętaj, że warto dodać atrybut “alt” w znaczniku <img> – opisującym zdjęcie, gdyby z jakiegoś powodu nie mogło się ono wczytać.</p> <h3 id="krok-piaty-stylowanie-tresci-za-pomoca-css">Krok piąty: Stylowanie treści za pomocą CSS</h3> <p>Ostatni krok w naszym kursie <b>jak się robi strone html</b> dotyczy podstaw stylowania. Możesz dodać style CSS (Cascading Style Sheets) do swojej strony, aby zmieniać wygląd tekstu, tła, obrazków i innych elementów. W pliku HTML, dodaj następujący kod między znaczniki <head></head>:</p> <p>“`</p> <style> body { font-family: Arial, sans-serif; }</p> <p> h2 { color: blue; }</p> <p> p { font-size: 18px; } </style> <p>“`</p> <p>Dzięki temu nasza strona będzie miała nieco bardziej nowoczesny wygląd. Wyświetlać się będzie w czcionce Arial (lub domyślnej czcionce bezszeryfowej), nagłówek </p> <h2> będzie w kolorze niebieskim, a akapity <b>p</b> będą miały rozmiar 18 punktów.</p> <p>Teraz znasz już podstawy <b>jak sie robi strone html</b>! Brawo! Możesz kontynuować naukę, eksperymentując z różnymi znacznikami HTML oraz dodając coraz więcej stylów CSS. Pamiętaj, że cierpliwość i praktyka to klucze do sukcesu w miłości i w kodowaniu stron internetowych.<br />W artykule poznaliśmy korzenie tworzenia stron internetowych, przekonując się, że <b>jak się robi stronę www</b>, czyli misterną sieć znaczników HTML, nie jest procesem tak trudnym, jak się mogło wydawać. Zdobytą wiedzą potrafimy teraz stworzyć prosty plik HTML, wypełnić go podstawowymi znacznikami i dodać atrakcje w postaci grafik oraz linków, pokazując tym samym <b>jak się tworzy stronę html</b> z elementami multimedialnymi. Na deser zaserwowano nam podstawy stylowania treści za pomocą CSS, co pozwoli nam urzeczywistnić estetykę naszej wizji. Zatem, z rękawiczki odpowiedzieliśmy sobie na pytanie <b>jak się robi strony html</b> w sposób prosty i przystępny dla każdego. Teraz pozostaje już tylko kontynuować naukę i rozwijać swoje umiejętności w przestrzeni cyfrowego kodowania.</p> <h3 id="polecane-atrakcje-dla-ciebie">Polecane atrakcje dla Ciebie:</h3> <div data-gyg-widget="auto" data-gyg-partner-id="AUZTKCV"></div> <p></p> <div data-gyg-href="https://widget.getyourguide.com/default/activities.frame" data-gyg-locale-code="pl-PL" data-gyg-widget="activities" data-gyg-number-of-items="6" data-gyg-partner-id="AUZTKCV"></div> </div> <div class="cs-entry__after-share-buttons"> <div class="pk-share-buttons-wrap pk-share-buttons-layout-default pk-share-buttons-scheme-bold-light pk-share-buttons-has-counts pk-share-buttons-has-total-counts pk-share-buttons-after-post pk-share-buttons-mode-rest" data-post-id="2616" data-share-url="https://softwaredevelopment.pl/poradnik-krok-po-kroku-jak-sie-robi-strone-html-dla-poczatkujacych/" > <div class="pk-share-buttons-total pk-share-buttons-total-no-count"> <div class="pk-share-buttons-title pk-font-primary">Total</div> <div class="pk-share-buttons-count pk-font-heading">0</div> <div class="pk-share-buttons-label pk-font-secondary">Shares</div> </div> <div class="pk-share-buttons-items"> <div class="pk-share-buttons-item pk-share-buttons-facebook pk-share-buttons-no-count" data-id="facebook"> <a href="https://www.facebook.com/sharer.php?u=https://softwaredevelopment.pl/poradnik-krok-po-kroku-jak-sie-robi-strone-html-dla-poczatkujacych/" class="pk-share-buttons-link" target="_blank"> <i class="pk-share-buttons-icon pk-icon pk-icon-facebook"></i> <span class="pk-share-buttons-label pk-font-primary">Share</span> <span class="pk-share-buttons-count pk-font-secondary">0</span> </a> </div> <div class="pk-share-buttons-item pk-share-buttons-twitter pk-share-buttons-no-count" data-id="twitter"> <a href="https://twitter.com/share?&text=Poradnik%20krok%20po%20kroku%3A%20Jak%20si%C4%99%20robi%20stron%C4%99%20HTML%20dla%20pocz%C4%85tkuj%C4%85cych&url=https://softwaredevelopment.pl/poradnik-krok-po-kroku-jak-sie-robi-strone-html-dla-poczatkujacych/" class="pk-share-buttons-link" target="_blank"> <i class="pk-share-buttons-icon pk-icon pk-icon-twitter"></i> <span class="pk-share-buttons-label pk-font-primary">Tweet</span> <span class="pk-share-buttons-count pk-font-secondary">0</span> </a> </div> <div class="pk-share-buttons-item pk-share-buttons-pinterest pk-share-buttons-no-count" data-id="pinterest"> <a href="https://pinterest.com/pin/create/bookmarklet/?url=https://softwaredevelopment.pl/poradnik-krok-po-kroku-jak-sie-robi-strone-html-dla-poczatkujacych/&media=https://softwaredevelopment.pl/wp-content/uploads/2023/11/coding-laptop-3-684x1024.jpg" class="pk-share-buttons-link" target="_blank"> <i class="pk-share-buttons-icon pk-icon pk-icon-pinterest"></i> <span class="pk-share-buttons-label pk-font-primary">Pin it</span> <span class="pk-share-buttons-count pk-font-secondary">0</span> </a> </div> </div> </div> </div> <div class="cs-entry__comments cs-entry__comments-collapse" id="comments-hidden"> <div id="respond" class="comment-respond"> <h5 class="cs-section-heading cnvs-block-section-heading is-style-cnvs-block-section-heading-default halignleft title-comment-reply "><span class="cnvs-section-title"><span>Dodaj komentarz <small><a rel="nofollow" id="cancel-comment-reply-link" href="/poradnik-krok-po-kroku-jak-sie-robi-strone-html-dla-poczatkujacych/#respond" style="display:none;">Anuluj pisanie odpowiedzi</a></small></span></span></h5><form action="https://softwaredevelopment.pl/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate><p class="comment-notes"><span id="email-notes">Twój adres e-mail nie zostanie opublikowany.</span> <span class="required-field-message">Wymagane pola są oznaczone <span class="required">*</span></span></p><p class="comment-form-comment"><label for="comment">Komentarz <span class="required">*</span></label> <textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required></textarea></p><p class="comment-form-author"><label for="author">Nazwa <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required /></p> <p class="comment-form-email"><label for="email">Adres e-mail <span class="required">*</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required /></p> <p class="comment-form-url"><label for="url">Witryna internetowa</label> <input id="url" name="url" type="url" value="" size="30" maxlength="200" autocomplete="url" /></p> <p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" /> <label for="wp-comment-cookies-consent">Zapamiętaj moje dane w tej przeglądarce podczas pisania kolejnych komentarzy.</label></p> <p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Komentarz wpisu" /> <input type='hidden' name='comment_post_ID' value='2616' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /> </p></form> </div> </div> <div class="cs-entry__comments-show" id="comments"> <button>View Comments (0)</button> </div> <div class="cs-entry__prev-next"> <div class="cs-entry__prev-next-item cs-entry__prev"> <a href="https://softwaredevelopment.pl/poradnik-dla-poczatkujacych-jak-stworzyc-gre-na-roblox-krok-po-kroku/" class="cs-entry__prev-next-link"> <div class="cs-entry__prev-next-label">Prev</div> <div class="cs-entry__prev-next-title-wrapper"> <span class="cs-entry__prev-next-title">Poradnik dla początkujących: Jak stworzyć grę na Roblox krok po kroku</span> </div> </a> <article class="cs-entry"> <div class="cs-entry__outer cs-entry__overlay cs-overlay-ratio cs-ratio-square" data-scheme="inverse"> <div class="cs-entry__inner cs-entry__thumbnail"> <div class="cs-overlay-background"> <img width="110" height="110" src="https://softwaredevelopment.pl/wp-content/uploads/2023/11/Roblox-Studio-1-110x110.jpg" class="attachment-csco-small size-csco-small wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://softwaredevelopment.pl/wp-content/uploads/2023/11/Roblox-Studio-1-110x110.jpg 110w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/Roblox-Studio-1-300x300.jpg 300w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/Roblox-Studio-1-150x150.jpg 150w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/Roblox-Studio-1-768x768.jpg 768w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/Roblox-Studio-1-80x80.jpg 80w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/Roblox-Studio-1-380x380.jpg 380w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/Roblox-Studio-1-800x800.jpg 800w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/Roblox-Studio-1.jpg 1000w" sizes="auto, (max-width: 110px) 100vw, 110px" /> </div> </div> <div class="cs-entry__inner cs-overlay-content cs-entry__content"> <div class="cs-entry__content-inner"> <span class="cs-entry__title-wrapper"> <h2 class="cs-entry__title">Poradnik dla początkujących: Jak stworzyć grę na Roblox krok po kroku</h2> <p class="cs-entry__excerpt">Cześć, drogi użytkowniku!</p> </span> </div> </div> <a href="https://softwaredevelopment.pl/poradnik-dla-poczatkujacych-jak-stworzyc-gre-na-roblox-krok-po-kroku/" class="cs-overlay-link"></a> </div> </article> </div> <div class="cs-entry__prev-next-item cs-entry__next"> <a href="https://softwaredevelopment.pl/tworzenie-strony-internetowej-w-html-krok-po-kroku-z-google/" class="cs-entry__prev-next-link"> <div class="cs-entry__prev-next-label">Next</div> <div class="cs-entry__prev-next-title-wrapper"> <span class="cs-entry__prev-next-title">Tworzenie strony internetowej w HTML: krok po kroku z Google</span> </div> </a> <article class="cs-entry"> <div class="cs-entry__outer cs-entry__overlay cs-overlay-ratio cs-ratio-square" data-scheme="inverse"> <div class="cs-entry__inner cs-entry__thumbnail"> <div class="cs-overlay-background"> <img width="110" height="110" src="https://softwaredevelopment.pl/wp-content/uploads/2023/11/HTML-editor-1-110x110.jpg" class="attachment-csco-small size-csco-small wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://softwaredevelopment.pl/wp-content/uploads/2023/11/HTML-editor-1-110x110.jpg 110w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/HTML-editor-1-150x150.jpg 150w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/HTML-editor-1-80x80.jpg 80w" sizes="auto, (max-width: 110px) 100vw, 110px" /> </div> </div> <div class="cs-entry__inner cs-overlay-content cs-entry__content"> <div class="cs-entry__content-inner"> <span class="cs-entry__title-wrapper"> <h2 class="cs-entry__title">Tworzenie strony internetowej w HTML: krok po kroku z Google</h2> <p class="cs-entry__excerpt">Stworzenie własnej strony internetowej nie musi być trudne ani skomplikowane</p> </span> </div> </div> <a href="https://softwaredevelopment.pl/tworzenie-strony-internetowej-w-html-krok-po-kroku-z-google/" class="cs-overlay-link"></a> </div> </article> </div> </div> </div> </div> <div class="cs-entry__subscribe"> <div class="cs-site-subscribe__item"> <div class="cs-site-subscribe__form"> <div class="cs-site-subscribe__info"> <div class="cs-site-subscribe__title-wrapper"> <h4 class="cs-site-subscribe__title">Subscribe to Our Newsletter</h4> <p class="cs-site-subscribe__excerpt">Get notified of the best deals on our WordPress themes.</p> </div> </div> </div> </div> </div> </div> </div> <aside id="secondary" class="cs-sidebar__area cs-widget-area"> <div class="cs-sidebar__inner"> <div class="widget powerkit_widget_posts-1 powerkit_widget_posts"><h5 class="cs-section-heading cnvs-block-section-heading is-style-cnvs-block-section-heading-default halignleft "><span class="cnvs-section-title"><span>Polecane artykuły</span></span></h5> <div class="widget-body pk-widget-posts pk-widget-posts-template-default pk-widget-posts-template-numbered posts-per-page-5"> <ul> <li class="pk-post-item"> <article class="post-2717 post type-post status-publish format-standard has-post-thumbnail category-elektronika category-inzynieria category-pomiary cs-entry cs-video-wrap" style="--cs-widget-heading-font-size: 0.875rem;"> <div class="pk-post-outer"> <div class="pk-post-inner pk-post-data"> <a href="https://softwaredevelopment.pl/przelicznik-cale-na-cm-klucz-do-precyzyjnych-pomiarow/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h6 class="cs-entry__title">Przelicznik cale na cm: klucz do precyzyjnych pomiarów</h6> <p class="cs-entry__excerpt">Niezależnie od dynamicznie zmieniającego się świata, w którym żyjemy,</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-date">30 października, 2024</div></div> </div> </div> </article> </li> <li class="pk-post-item"> <article class="post-2713 post type-post status-publish format-standard has-post-thumbnail category-kurczak category-pieczenie category-smazone cs-entry cs-video-wrap" style="--cs-widget-heading-font-size: 0.875rem;"> <div class="pk-post-outer"> <div class="pk-post-inner pk-post-data"> <a href="https://softwaredevelopment.pl/pieczenie-nog-kurczaka-w-piekarniku-prosty-przepis-na-soczyste-udka/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h6 class="cs-entry__title">Pieczenie nóg kurczaka w piekarniku: prosty przepis na soczyste udka</h6> <p class="cs-entry__excerpt">Pieczenie udek z kurczaka w piekarniku to nie tylko sprawdzony, lecz także</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-date">29 października, 2024</div></div> </div> </div> </article> </li> <li class="pk-post-item"> <article class="post-2709 post type-post status-publish format-standard has-post-thumbnail category-biznes category-efektywnosc category-technologia cs-entry cs-video-wrap" style="--cs-widget-heading-font-size: 0.875rem;"> <div class="pk-post-outer"> <div class="pk-post-inner pk-post-data"> <a href="https://softwaredevelopment.pl/zalety-outsourcingu-it-oszczednosci-i-innowacje-dla-biznesu/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h6 class="cs-entry__title">Zalety outsourcingu IT: oszczędności i innowacje dla biznesu</h6> <p class="cs-entry__excerpt">Outsourcing IT to temat, który w ostatnich latach zyskuje na znaczeniu w</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-date">28 października, 2024</div></div> </div> </div> </article> </li> <li class="pk-post-item"> <article class="post-2705 post type-post status-publish format-standard has-post-thumbnail category-komunikacja category-poradniki category-zdjecia cs-entry cs-video-wrap" style="--cs-widget-heading-font-size: 0.875rem;"> <div class="pk-post-outer"> <div class="pk-post-inner pk-post-data"> <a href="https://softwaredevelopment.pl/jak-pobrac-zdjecia-z-whatsapp-na-komputer-latwy-poradnik/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h6 class="cs-entry__title">Jak pobrać zdjęcia z WhatsApp na komputer: łatwy poradnik</h6> <p class="cs-entry__excerpt">W dzisiejszych czasach WhatsApp zyskał status niezastąpionego narzędzia</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-date">22 października, 2024</div></div> </div> </div> </article> </li> <li class="pk-post-item"> <article class="post-2701 post type-post status-publish format-standard has-post-thumbnail category-finanse category-podatki category-vat cs-entry cs-video-wrap" style="--cs-widget-heading-font-size: 0.875rem;"> <div class="pk-post-outer"> <div class="pk-post-inner pk-post-data"> <a href="https://softwaredevelopment.pl/jak-odliczyc-vat-praktyczny-przewodnik-dla-przedsiebiorcow/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h6 class="cs-entry__title">Jak odliczyć VAT: Praktyczny przewodnik dla przedsiębiorców</h6> <p class="cs-entry__excerpt">Odliczanie VAT odgrywa fundamentalną rolę w prowadzeniu działalności</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-date">20 października, 2024</div></div> </div> </div> </article> </li> </ul> </div> </div><div class="widget powerkit_widget_posts-2 powerkit_widget_posts"><h5 class="cs-section-heading cnvs-block-section-heading is-style-cnvs-block-section-heading-default halignleft "><span class="cnvs-section-title"><span>Ostatnio dodane</span></span></h5> <div class="widget-body pk-widget-posts pk-widget-posts-template-default pk-widget-posts-template-large posts-per-page-3"> <ul> <li class="pk-post-item"> <article class="post-2697 post type-post status-publish format-standard has-post-thumbnail category-biznes category-technologia category-uslugi-elektroniczne cs-entry cs-video-wrap" style="--cs-widget-heading-font-size: 0.875rem;"> <div class="pk-post-outer"> <div class="pk-post-inner pk-post-data"> <a href="https://softwaredevelopment.pl/jak-wyslac-pismo-do-zus-przez-pue-i-zaoszczedzic-czas-na-formalnosci/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h5 class="cs-entry__title">Jak wysłać pismo do zus przez pue i zaoszczędzić czas na formalności</h5> <p class="cs-entry__excerpt">Witaj w świecie PUE ZUS!</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-date">9 września, 2024</div></div> </div> </div> </article> </li> <li class="pk-post-item"> <article class="post-2693 post type-post status-publish format-standard has-post-thumbnail category-jezyki-programowania category-jezykoznawstwo category-komunikacja category-wspolpraca cs-entry cs-video-wrap" style="--cs-widget-heading-font-size: 0.875rem;"> <div class="pk-post-outer"> <div class="pk-post-inner pk-post-data"> <a href="https://softwaredevelopment.pl/jak-zmienic-jezyk-w-cs-go-dla-lepszej-komunikacji-w-grze/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h5 class="cs-entry__title">Jak zmienić język w cs go dla lepszej komunikacji w grze</h5> <p class="cs-entry__excerpt">Porozumiewanie się i zrozumienie zasad grając w Counter-Strike: Global Offensive</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-date">12 sierpnia, 2024</div></div> </div> </div> </article> </li> <li class="pk-post-item"> <article class="post-2689 post type-post status-publish format-standard has-post-thumbnail category-aplikacje category-muzyka category-synchronizacja cs-entry cs-video-wrap" style="--cs-widget-heading-font-size: 0.875rem;"> <div class="pk-post-outer"> <div class="pk-post-inner pk-post-data"> <a href="https://softwaredevelopment.pl/jak-sciagnac-muzyke-na-iphone-proste-sposoby-na-dostep-do-ulubionych-utworow-offline/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h5 class="cs-entry__title">Jak ściągnąć muzykę na iphone – proste sposoby na dostęp do ulubionych utworów offline</h5> <p class="cs-entry__excerpt">Czy wiesz, jak wygodnie pobierać muzykę na swojego iPhone’a?</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-date">7 sierpnia, 2024</div></div> </div> </div> </article> </li> </ul> </div> </div> </div> </aside> </div> <div class="cs-entry__post-related"> <h5 class="cs-section-heading cnvs-block-section-heading is-style-cnvs-block-section-heading-default halignleft "><span class="cnvs-section-title"><span>You May Also Like</span></span></h5> <div class="cs-entry__post-wrap" style="--cs-font-headings-size: 1.125rem; --cs-font-headings-excerpt-size: 1.125rem;"> <article class="post-2566 post type-post status-publish format-standard has-post-thumbnail category-jezyki-programowania category-poczatkujacy category-programowanie cs-entry cs-video-wrap"> <div class="cs-entry__outer"> <div class="cs-entry__inner cs-entry__thumbnail cs-entry__overlay cs-overlay-ratio cs-ratio-original" data-scheme="inverse"> <div class="cs-overlay-background cs-overlay-transparent"> <img width="260" height="195" src="https://softwaredevelopment.pl/wp-content/uploads/2023/11/programming-languages-4-260x195.jpg" class="attachment-csco-thumbnail-small size-csco-thumbnail-small wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://softwaredevelopment.pl/wp-content/uploads/2023/11/programming-languages-4-260x195.jpg 260w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/programming-languages-4-300x225.jpg 300w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/programming-languages-4-200x150.jpg 200w" sizes="auto, (max-width: 260px) 100vw, 260px" /> </div> <a href="https://softwaredevelopment.pl/jaki-jezyk-programowania-na-poczatek-odkryj-najlepsze-opcje-na-2024-rok/" class="cs-overlay-link"></a> </div> <div class="cs-entry__inner cs-entry__content"> <a href="https://softwaredevelopment.pl/jaki-jezyk-programowania-na-poczatek-odkryj-najlepsze-opcje-na-2024-rok/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h2 class="cs-entry__title">Jaki język programowania na początek? Odkryj najlepsze opcje na 2024 rok!</h2> <p class="cs-entry__excerpt">Cześć!</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-author"><span class="cs-by">by</span><a class="cs-meta-author-inner url fn n" href="https://softwaredevelopment.pl/author/admin/" title="View all posts by softwaredevelopment.pl"><span class="cs-author">softwaredevelopment.pl</span></a></div><div class="cs-meta-date">23 listopada, 2023</div></div> </div> </div> </article> <article class="post-2570 post type-post status-publish format-standard has-post-thumbnail category-poradniki category-webdesign category-wordpress cs-entry cs-video-wrap"> <div class="cs-entry__outer"> <div class="cs-entry__inner cs-entry__thumbnail cs-entry__overlay cs-overlay-ratio cs-ratio-original" data-scheme="inverse"> <div class="cs-overlay-background cs-overlay-transparent"> <img width="260" height="195" src="https://softwaredevelopment.pl/wp-content/uploads/2023/11/website-creation-260x195.jpg" class="attachment-csco-thumbnail-small size-csco-thumbnail-small wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://softwaredevelopment.pl/wp-content/uploads/2023/11/website-creation-260x195.jpg 260w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/website-creation-300x225.jpg 300w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/website-creation-200x150.jpg 200w" sizes="auto, (max-width: 260px) 100vw, 260px" /> </div> <a href="https://softwaredevelopment.pl/jak-samemu-zrobic-strone-internetowa-praktyczny-przewodnik-dla-poczatkujacych/" class="cs-overlay-link"></a> </div> <div class="cs-entry__inner cs-entry__content"> <a href="https://softwaredevelopment.pl/jak-samemu-zrobic-strone-internetowa-praktyczny-przewodnik-dla-poczatkujacych/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h2 class="cs-entry__title">Jak samemu zrobić stronę internetową: Praktyczny przewodnik dla początkujących</h2> <p class="cs-entry__excerpt">Czy kiedykolwiek marzyłeś o stworzeniu własnej strony internetowej, ale nie</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-author"><span class="cs-by">by</span><a class="cs-meta-author-inner url fn n" href="https://softwaredevelopment.pl/author/admin/" title="View all posts by softwaredevelopment.pl"><span class="cs-author">softwaredevelopment.pl</span></a></div><div class="cs-meta-date">23 listopada, 2023</div></div> </div> </div> </article> <article class="post-2562 post type-post status-publish format-standard has-post-thumbnail category-poradniki category-strony-internetowe category-wordpress cs-entry cs-video-wrap"> <div class="cs-entry__outer"> <div class="cs-entry__inner cs-entry__thumbnail cs-entry__overlay cs-overlay-ratio cs-ratio-original" data-scheme="inverse"> <div class="cs-overlay-background cs-overlay-transparent"> <img width="260" height="195" src="https://softwaredevelopment.pl/wp-content/uploads/2023/11/web-design-1-260x195.jpg" class="attachment-csco-thumbnail-small size-csco-thumbnail-small wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://softwaredevelopment.pl/wp-content/uploads/2023/11/web-design-1-260x195.jpg 260w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/web-design-1-300x225.jpg 300w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/web-design-1-200x150.jpg 200w" sizes="auto, (max-width: 260px) 100vw, 260px" /> </div> <a href="https://softwaredevelopment.pl/jak-stworzyc-wlasna-strone-internetowa-krok-po-kroku-dla-poczatkujacych/" class="cs-overlay-link"></a> </div> <div class="cs-entry__inner cs-entry__content"> <a href="https://softwaredevelopment.pl/jak-stworzyc-wlasna-strone-internetowa-krok-po-kroku-dla-poczatkujacych/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h2 class="cs-entry__title">Jak stworzyć własną stronę internetową: krok po kroku dla początkujących</h2> <p class="cs-entry__excerpt">Czy kiedykolwiek marzyłeś o stworzeniu własnej strony internetowej, ale nie</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-author"><span class="cs-by">by</span><a class="cs-meta-author-inner url fn n" href="https://softwaredevelopment.pl/author/admin/" title="View all posts by softwaredevelopment.pl"><span class="cs-author">softwaredevelopment.pl</span></a></div><div class="cs-meta-date">23 listopada, 2023</div></div> </div> </div> </article> <article class="post-2572 post type-post status-publish format-standard has-post-thumbnail category-lacznosc category-poradniki category-technologia cs-entry cs-video-wrap"> <div class="cs-entry__outer"> <div class="cs-entry__inner cs-entry__thumbnail cs-entry__overlay cs-overlay-ratio cs-ratio-original" data-scheme="inverse"> <div class="cs-overlay-background cs-overlay-transparent"> <img width="260" height="195" src="https://softwaredevelopment.pl/wp-content/uploads/2023/11/computer-desk-260x195.jpg" class="attachment-csco-thumbnail-small size-csco-thumbnail-small wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://softwaredevelopment.pl/wp-content/uploads/2023/11/computer-desk-260x195.jpg 260w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/computer-desk-300x225.jpg 300w, https://softwaredevelopment.pl/wp-content/uploads/2023/11/computer-desk-200x150.jpg 200w" sizes="auto, (max-width: 260px) 100vw, 260px" /> </div> <a href="https://softwaredevelopment.pl/podlaczanie-routera-do-komputera-krok-po-kroku-z-prostymi-wskazowkami-dla-arduino-oraz-wifi/" class="cs-overlay-link"></a> </div> <div class="cs-entry__inner cs-entry__content"> <a href="https://softwaredevelopment.pl/podlaczanie-routera-do-komputera-krok-po-kroku-z-prostymi-wskazowkami-dla-arduino-oraz-wifi/" class="cs-entry__title-wrapper"> <span class="cs-entry__title-effect"> <h2 class="cs-entry__title">Podłączanie routera do komputera: krok po kroku z prostymi wskazówkami dla Arduino oraz WiFi</h2> <p class="cs-entry__excerpt">Podłączanie routera do komputera może wydawać się skomplikowanym zadaniem,</p> </span> </a> <div class="cs-entry__post-meta" ><div class="cs-meta-author"><span class="cs-by">by</span><a class="cs-meta-author-inner url fn n" href="https://softwaredevelopment.pl/author/admin/" title="View all posts by softwaredevelopment.pl"><span class="cs-author">softwaredevelopment.pl</span></a></div><div class="cs-meta-date">23 listopada, 2023</div></div> </div> </div> </article> </div> </div> </div> </div> </main> <footer class="cs-footer"> <div class="cs-footer__top" data-scheme="default"> <div class="cs-container"> <div class="cs-footer__item"> <div class="cs-footer__col cs-col-left"> <div class="cs-footer__inner"> <div class="cs-logo"> <a class="cs-footer__logo cs-logo-default" href="https://softwaredevelopment.pl/"> <img src="https://softwaredevelopment.pl/wp-content/uploads/2023/11/soft.png" alt="softwaredevelopment.pl" > </a> <a class="cs-footer__logo cs-logo-dark" href="https://softwaredevelopment.pl/"> <img src="https://softwaredevelopment.pl/wp-content/uploads/2023/11/soft.png" alt="softwaredevelopment.pl" > </a> </div> </div> </div> <div class="cs-footer__col cs-col-center"> <div class="cs-footer__inner"> <nav class="cs-footer__nav"> </nav> </div> </div> <div class="cs-footer__col cs-col-right"> <div class="cs-footer__inner"> <div class="cs-footer-social-links"> <div class="pk-social-links-wrap pk-social-links-template-nav pk-social-links-align-default pk-social-links-scheme-default pk-social-links-titles-disabled pk-social-links-counts-enabled pk-social-links-labels-disabled pk-social-links-mode-php pk-social-links-mode-rest"> <div class="pk-social-links-items"> </div> </div> </div> </div> </div> </div> </div> </div> <div class="cs-footer__bottom" data-scheme="default"> <div class="cs-container"> <div class="cs-footer__item"> <div class="cs-footer__col cs-col-left"> <div class="cs-footer__inner"> <div class="cs-footer__copyright"> <br><br> Portal należy do grupy MediaLink. Współpraca? Napisz na <a href="mailto:redakcja@medialink.pl" target="_blank">redakcja@medialink.pl</a> </div> </div> </div> <div class="cs-footer__col cs-col-right"> <div class="cs-footer__inner"> <nav class="cs-footer__nav cs-footer__nav-horizontal"> <div class="cs-footer__nav-item"><ul id="menu-glowne-2" class="cs-footer__nav-inner "><li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2619"><a href="https://softwaredevelopment.pl/kategoria/programowanie/">Programowanie</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-2620"><a href="https://softwaredevelopment.pl/kategoria/poradniki/">Poradniki</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2621"><a href="https://softwaredevelopment.pl/kategoria/jezyki-programowania/">Języki programowania</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2622"><a href="https://softwaredevelopment.pl/kategoria/webdesign/">Webdesign</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-2623"><a href="https://softwaredevelopment.pl/kategoria/html/">Html</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2624"><a href="https://softwaredevelopment.pl/kategoria/wordpress/">WordPress</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2625"><a href="https://softwaredevelopment.pl/kategoria/tworzenie-stron/">Tworzenie stron</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2626"><a href="https://softwaredevelopment.pl/kategoria/nauka/">Nauka</a></li> </ul></div> </nav> </div> </div> </div> </div> </div> </footer> </div> </div> <script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"\/*"},{"not":{"href_matches":["\/wp-*.php","\/wp-admin\/*","\/wp-content\/uploads\/*","\/wp-content\/*","\/wp-content\/plugins\/*","\/wp-content\/themes\/blueprint\/*","\/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <a href="#top" class="pk-scroll-to-top"> <i class="pk-icon pk-icon-up"></i> </a> <div class="pk-mobile-share-overlay"> </div> <div id="fb-root"></div> <script async defer crossorigin="anonymous" src="https://connect.facebook.net/pl_PL/sdk.js#xfbml=1&version=v17.0&appId=&autoLogAppEvents=1" nonce="Ci8te34e"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/canvas/components/basic-elements/block-alert/public-block-alert.js?ver=2.4.2" id="canvas-block-alert-script-js"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/canvas/components/basic-elements/block-collapsibles/public-block-collapsibles.js?ver=2.4.2" id="canvas-block-collapsibles-script-js"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/canvas/components/basic-elements/block-tabs/public-block-tabs.js?ver=2.4.2" id="canvas-block-tabs-script-js"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/canvas/components/justified-gallery/block/jquery.justifiedGallery.min.js?ver=2.4.2" id="justifiedgallery-js"></script> <script id="canvas-justified-gallery-js-extra"> var canvasJG = {"rtl":""}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/canvas/components/justified-gallery/block/public-block-justified-gallery.js?ver=2.4.2" id="canvas-justified-gallery-js"></script> <script src="https://softwaredevelopment.pl/wp-includes/js/imagesloaded.min.js?ver=5.0.0" id="imagesloaded-js"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/canvas/components/slider-gallery/block/flickity.pkgd.min.js?ver=2.4.2" id="flickity-js"></script> <script id="canvas-slider-gallery-js-extra"> var canvas_sg_flickity = {"page_info_sep":" of "}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/canvas/components/slider-gallery/block/public-block-slider-gallery.js?ver=2.4.2" id="canvas-slider-gallery-js"></script> <script src="https://softwaredevelopment.pl/wp-includes/js/dist/vendor/wp-polyfill.min.js?ver=3.15.0" id="wp-polyfill-js"></script> <script id="contact-form-7-js-extra"> var wpcf7 = {"api":{"root":"https:\/\/softwaredevelopment.pl\/wp-json\/","namespace":"contact-form-7\/v1"},"cached":"1"}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/contact-form-7/includes/js/index.js?ver=5.5.4" id="contact-form-7-js"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/basic-elements/public/js/public-powerkit-basic-elements.js?ver=4.0.0" id="powerkit-basic-elements-js"></script> <script id="powerkit-justified-gallery-js-extra"> var powerkitJG = {"rtl":""}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/justified-gallery/public/js/public-powerkit-justified-gallery.js?ver=2.9.0" id="powerkit-justified-gallery-js"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/lightbox/public/js/glightbox.min.js?ver=2.9.0" id="glightbox-js"></script> <script id="powerkit-lightbox-js-extra"> var powerkit_lightbox_localize = {"text_previous":"Previous","text_next":"Next","text_close":"Close","text_loading":"Loading","text_counter":"of","single_image_selectors":".entry-content img","gallery_selectors":".wp-block-gallery,.gallery","exclude_selectors":".sight-portfolio-area","zoom_icon":"1"}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/lightbox/public/js/public-powerkit-lightbox.js?ver=2.9.0" id="powerkit-lightbox-js"></script> <script id="powerkit-opt-in-forms-js-extra"> var opt_in = {"ajax_url":"https:\/\/softwaredevelopment.pl\/wp-admin\/admin-ajax.php","warning_privacy":"Please confirm that you agree with our policies."}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/opt-in-forms/public/js/public-powerkit-opt-in-forms.js?ver=2.9.0" id="powerkit-opt-in-forms-js"></script> <script async="async" defer="defer" src="//assets.pinterest.com/js/pinit.js?ver=6.8" id="powerkit-pinterest-js"></script> <script id="powerkit-pin-it-js-extra"> var powerkit_pinit_localize = {"image_selectors":".entry-content img","exclude_selectors":".cnvs-block-row,.cnvs-block-section,.cnvs-block-posts .entry-thumbnail,.cnvs-post-thumbnail,.pk-block-author,.pk-featured-categories img,.pk-inline-posts-container img,.pk-instagram-image,.pk-subscribe-image,.wp-block-cover,.pk-block-posts,.sight-portfolio-entry-link-page,.cs-posts-area__main,.cs-entry,.pk-widget-author img","only_hover":"1"}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/pinterest/public/js/public-powerkit-pin-it.js?ver=2.9.0" id="powerkit-pin-it-js"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/scroll-to-top/public/js/public-powerkit-scroll-to-top.js?ver=2.9.0" id="powerkit-scroll-to-top-js"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/share-buttons/public/js/public-powerkit-share-buttons.js?ver=2.9.0" id="powerkit-share-buttons-js"></script> <script id="powerkit-slider-gallery-js-extra"> var powerkit_sg_flickity = {"page_info_sep":" of "}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/slider-gallery/public/js/public-powerkit-slider-gallery.js?ver=2.9.0" id="powerkit-slider-gallery-js"></script> <script id="powerkit-table-of-contents-js-extra"> var powerkit_toc_config = {"label_show":"Show","label_hide":"Hide"}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/powerkit/modules/table-of-contents/public/js/public-powerkit-table-of-contents.js?ver=2.9.0" id="powerkit-table-of-contents-js"></script> <script src="https://softwaredevelopment.pl/wp-content/plugins/sight/render/js/jquery.magnific-popup.min.js?ver=1729284334" id="magnific-popup-js"></script> <script id="sight-block-script-js-extra"> var sight_lightbox_localize = {"text_previous":"Previous","text_next":"Next","text_close":"Close","text_loading":"Loading","text_counter":"of"}; </script> <script src="https://softwaredevelopment.pl/wp-content/plugins/sight/render/js/sight.js?ver=1729284334" id="sight-block-script-js"></script> <script id="csco-scripts-js-extra"> var csLocalize = {"siteSchemeMode":"system","siteSchemeToogle":"1"}; var csco_mega_menu = {"rest_url":"https:\/\/softwaredevelopment.pl\/wp-json\/csco\/v1\/menu-posts"}; </script> <script src="https://softwaredevelopment.pl/wp-content/themes/blueprint/assets/js/scripts.js?ver=1.1.0" id="csco-scripts-js"></script> <script src="https://softwaredevelopment.pl/wp-includes/js/comment-reply.min.js?ver=6.8" id="comment-reply-js" async data-wp-strategy="async"></script> <script type="text/javascript"> "use strict"; (function($) { $( window ).on( 'load', function() { // Each All Share boxes. $( '.pk-share-buttons-mode-rest' ).each( function() { var powerkitButtonsIds = [], powerkitButtonsBox = $( this ); // Check Counts. if ( ! powerkitButtonsBox.hasClass( 'pk-share-buttons-has-counts' ) && ! powerkitButtonsBox.hasClass( 'pk-share-buttons-has-total-counts' ) ) { return; } powerkitButtonsBox.find( '.pk-share-buttons-item' ).each( function() { if ( $( this ).attr( 'data-id' ).length > 0 ) { powerkitButtonsIds.push( $( this ).attr( 'data-id' ) ); } }); // Generate accounts data. var powerkitButtonsData = {}; if( powerkitButtonsIds.length > 0 ) { powerkitButtonsData = { 'ids' : powerkitButtonsIds.join(), 'post_id' : powerkitButtonsBox.attr( 'data-post-id' ), 'url' : powerkitButtonsBox.attr( 'data-share-url' ), }; } // Get results by REST API. $.ajax({ type: 'GET', url: 'https://softwaredevelopment.pl/wp-json/social-share/v1/get-shares', data: powerkitButtonsData, beforeSend: function(){ // Add Loading Class. powerkitButtonsBox.addClass( 'pk-share-buttons-loading' ); }, success: function( response ) { if ( ! $.isEmptyObject( response ) && ! response.hasOwnProperty( 'code' ) ) { // Accounts loop. $.each( response, function( index, data ) { if ( index !== 'total_count' ) { // Find Bsa Item. var powerkitButtonsItem = powerkitButtonsBox.find( '.pk-share-buttons-item[data-id="' + index + '"]'); // Set Count. if ( data.hasOwnProperty( 'count' ) && data.count ) { powerkitButtonsItem.removeClass( 'pk-share-buttons-no-count' ).addClass( 'pk-share-buttons-item-count' ); powerkitButtonsItem.find( '.pk-share-buttons-count' ).html( data.count ); } else { powerkitButtonsItem.addClass( 'pk-share-buttons-no-count' ); } } }); if ( powerkitButtonsBox.hasClass( 'pk-share-buttons-has-total-counts' ) && response.hasOwnProperty( 'total_count' ) ) { var powerkitButtonsTotalBox = powerkitButtonsBox.find( '.pk-share-buttons-total' ); if ( response.total_count ) { powerkitButtonsTotalBox.find( '.pk-share-buttons-count' ).html( response.total_count ); powerkitButtonsTotalBox.show().removeClass( 'pk-share-buttons-total-no-count' ); } } } // Remove Loading Class. powerkitButtonsBox.removeClass( 'pk-share-buttons-loading' ); }, error: function() { // Remove Loading Class. powerkitButtonsBox.removeClass( 'pk-share-buttons-loading' ); } }); }); }); })(jQuery); </script> <script type="text/javascript"> "use strict"; (function($) { $( window ).on( 'load', function() { // Get all links. var powerkitSLinksIds = []; var powerkitSLinksRestBox = $( '.pk-social-links-mode-rest' ); // Generate links Ids. $( powerkitSLinksRestBox ).each( function( index, wrap ) { if ( ! $( wrap ).hasClass( 'pk-social-links-counts-disabled' ) ) { $( wrap ).find( '.pk-social-links-item' ).each( function() { if ( $( this ).attr( 'data-id' ).length > 0 ) { powerkitSLinksIds.push( $( this ).attr( 'data-id' ) ); } }); } }); // Generate links data. var powerkitSLinksData = {}; if( powerkitSLinksIds.length > 0 ) { powerkitSLinksData = { 'ids' : powerkitSLinksIds.join() }; } // Check data. if ( ! Object.entries( powerkitSLinksData ).length ) { return; } // Get results by REST API. $.ajax({ type: 'GET', url: 'https://softwaredevelopment.pl/wp-json/social-counts/v1/get-counts', data: powerkitSLinksData, beforeSend: function(){ // Add Loading Class. powerkitSLinksRestBox.addClass( 'pk-social-links-loading' ); }, success: function( response ) { if ( ! $.isEmptyObject( response ) && ! response.hasOwnProperty( 'code' ) ) { // SLinks loop. $.each( response, function( index, data ) { // Find Bsa Item. var powerkitSLinksItem = powerkitSLinksRestBox.find( '.pk-social-links-item[data-id="' + index + '"]'); // Set Class. if ( data.hasOwnProperty( 'class' ) ) { powerkitSLinksItem.addClass( data.class ); } // Set Count. if ( data.hasOwnProperty( 'result' ) && data.result !== null && data.result.hasOwnProperty( 'count' ) ) { if ( data.result.count ) { // Class Item. powerkitSLinksItem.removeClass( 'pk-social-links-no-count' ).addClass( 'pk-social-links-item-count' ); // Count item. powerkitSLinksItem.find( '.pk-social-links-count' ).not( '.pk-tippy' ).html( data.result.count ); } } else { powerkitSLinksItem.addClass( 'pk-social-links-no-count' ); } }); } // Remove Loading Class. powerkitSLinksRestBox.removeClass( 'pk-social-links-loading' ); }, error: function() { // Remove Loading Class. powerkitSLinksRestBox.removeClass( 'pk-social-links-loading' ); } }); }); })(jQuery); </script> </body> </html>