Prosty własny CSS i JS

Opis

Spersonalizuj wygląd swojej strony na WordPressie dodając w prosty sposób własny kod CSS oraz JS. Nie musisz modyfikować plików motywu lub wtyczek. To idealny sposób na dodanie kodu CSS, który podrasuje Twoją stronę.

Funkcje

  • Edytor tekstu z podświetlaniem składni
  • Wydrukuj kod wbudowany lub dołącz do pliku zewnętrznego
  • Wydrukuj kod w nagłówku lub stopce
  • Dodaj CSS lub JS do front-endu lub strony administracyjnej
  • Dodaj tyle kodów, ile chcesz
  • Zachowaj zmiany także podczas zmiany motywu

Zrzuty ekranu

  • Zarządzaj własnymi kodami

  • Dodaj/Edytuj JavaScript

  • Dodaj/Edytuj CSS

  • Dodaj/Edytuj HTML

Instalacja

  • W panelu administracyjnym WP kliknij „Wtyczki” -> „Dodaj nową”.
  • W polu wprowadzania przeglądarki wpisz „Prosty własny CSS i JS”.
  • Wybierz wtyczkę „Prosty własny CSS i JS” i kliknij „Zainstaluj”.
  • Włącz wtyczkę.

LUB…

  • Pobierz wtyczkę z tej strony.
  • Zapisz plik .zip w wybranym miejscu na swoim komputerze.
  • Otwórz panel administracyjny WP i kliknij „Wtyczki” -> „Dodaj nową”.
  • Kliknij „Prześlij”, a następnie przejdź do pliku .zip pobranego z tej strony.
  • Kliknij „Zainstaluj” i następnie „Włącz wtyczkę”.

LUB…

  • Pobierz wtyczkę z tej strony.
  • Wypakuj plik .zip do wybranego katalogu na swoim komputerze.
  • Aby uzyskać dostęp do katalogów plików swojej witryny, skorzystaj z protokołu FTP lub cPanel swojego hosta.
  • Przejdź do katalogu wp-content/plugins.
  • Prześlij wyodrębniony katalog custom-css-js do tej lokalizacji katalogu.
  • Otwórz panel administracyjny WP, kliknij stronę „Wtyczki”, a następnie kliknij „Włącz” pod nowo dodaną wtyczką „Prosty własny CSS i JS”.

Najczęściej zadawane pytania

A co jeśli chcę dodać wiele zewnętrznych kodów CSS?

Jeśli dodasz kilka wstawek zewnętrznych tego samego typu (np. dwie wstawki zewnętrzne z kodem CSS), wtedy wszystkie one będą wylistowane jedna za drugą.

Czy ta wtyczka wpłynie na czas wczytywania?

Gdy klikasz przycisk Zapisz, kod zostaje zapisany w plikach cache. Nie ma zatem mowy o nagminnym odpytywaniu bazy danych, co mogłoby przyczynić się do zwolnienia prędkości działania strony.

Czy wtyczka modyfikuje kod, który piszę w edytorze?

Nie. Kod, który wprowadzasz jest wstawiany do strony w taki sposób, w jaki go wprowadziłeś. Nie jest on modyfikowany, sprawdzany, weryfikowany w żaden sposób. Bierzesz pełną odpowiedzialność za to, jaki kod wprowadzasz i ewentualne błędy.

Mój kod nie pojawia się na stronie

Spróbuj jednego z poniższych:
1. Jeśli używasz wtyczki typu cache plugin (np. „W3 Total Cache lub „WP Fastest Cache”), to nie zapomnij wyczyścić pamięci podręcznej po dodaniu nowej wstawki lub edycji aktualnej.
2. Upewnij się, że wstawka znajduje się w Opublikowanych, a nie w Szkicach lub Koszu
3. Sprawdź czy folder wp-content/uploads/custom-css-js znajduje się na serwerze i ma prawa do zapisu.

Czy ta wtyczka działa z multisite?

Tak.

Co jeśli zmienię motyw?

Wtyczka Prosty własny CSS i JS jest niezależna od używanego motywu. Wstawki dodane do tej wtyczki będą funkcjonować na każdym aktualnie używanym motywie.

Czy mogę użyć preprocesora CSS, np. LESS lub Sass?

Na ten moment darmowa wersja obsługuje jedynie czysty CSS. Sprawdź wersję PRO, która obsługuje preprocesory CSS.

Czy mogę wgrać własne obrazki do użycia z moimi wstawkami CSS?

Tak. Możesz wgrać własne obrazki do Biblioteki Mediów by później odnieść się do nich wewnątrz arkusza CSS za pomocą ich bezpośredniego URL. Przykład:
div#content {
background-image: url(’http://przyklad.pl/wp-content/uploads/2015/12/twoje-zdjecie.jpg’);
}

Czy mogę używać reguł CSS takich jak @import i @font-face?

Tak.

Kto może publikować/edytować/usuwać kody niestandardowe?

Domyślnie tylko admin będzie mógł publikować, edytować i usuwać wstawki. Po aktywacji tej wtyczki pojawi się taka rola jak Web Designer. Możesz przypisać dowolnego użytkownika do tej roli, aby umożliwić mu tworzenie, edycję i usuwanie wstawek. W ustawieniach tej wtyczki znajduje się opcja usunięcia tej roli.

Moja witryna ma adresy URL HTTPS, ale kody są połączone jako HTTP

Adres URL dla połączonych kodów jest tworzony tak samo jak adres URL dla innych mediów (z biblioteki multimediów) za pomocą opcji Adres WordPress znajdującej się na stronie WP Admin -> Ustawienia -> Ogólne, jak pokazano na tym zrzucie ekranu. Jeśli adres WordPress ma HTTPS w adresie URL, to własne kody i wszystkie inne media będą miały HTTPS w adresie URL.

Recenzje

2025-06-23
There is no other plugin that allows you to control settings like WP conditional location rules, stores versioned copies of the files in a directory making local development easier, and is a simple UX to deploy rapid updates cutting down on development time. On top of that, the support team has gone above and beyond to address and fix limitations to allow my business and developers’ workflows to continue without a hitch. I highly recommend this plugin to anyone that’s looking for a definitive solution to deploy HTML, CSS, JS snippets on a per-post basis.
2025-02-22
Thanks to this plugin, I was able to make modifications to parts of my own website that had been eluding me for WEEKS through other CSS plugins that I had been trying to use.
2025-01-27 5 odpowiedzi
in almost all cases I’ve found where a Wordpress site is hacked. This plugin is activated by the hacker. The problem is that when you delete the plugin, thinking you’ve cleaned up after the attack, the database tables for this plugin is still very present in the database causing your website to get infected again and again. This plugin probably does what it does very well, but to me, I can’t understand how it could be allowed to exist.
2025-01-06
This plugin is basically a must. When using a free theme, I am quite limited in editing the appearance. And some functions cannot be solved using plugins. There are three things that I have been missing for a long time. Insufficient highlighting of the wrong number of brackets. It does turn red when I click on it, but it would be better if it was red permanently or turned red after saving. Basic ability to undo changes. Ability to automatically format code However, this does not change the fact that I give it five stars.
2025-01-04
Simple Custom CSS and JS does exactly what it says on the box. I’ve been using it for many years on non-profit websites, and it has proven rock solid. Here’s what I especially appreciated: CSS, JS, and HTML syntax highlighting. Code can be inline or loaded externally (and thus cached). Code can be loaded in the header, body, or footer. Code can be loaded on the front end, in the block editor and/or admin pages. Code can easily be enabled or disabled with a single click. That is a lot of features for a free plugin, and I’m perfectly content with that. There is a reasonably priced premium version with advanced features like CSS preprocessors and code revisions if these are important features to you, but the free version is a great start and enough for many projects.
2024-12-09 2 odpowiedzi
This plugin does flush all permalinks settings on install, without confirmation of Admin, which impacted the whole permalinks settings, and required me to deactivate and reactivate multiple plugins to get their permalinks settings setup again, which is loss of time and requires a clear confirmation before doing that on install.
Przeczytaj 100 recenzji

Kontrybutorzy i deweloperzy

„Prosty własny CSS i JS” jest oprogramowaniem open source. Poniższe osoby miały wkład w rozwój wtyczki.

Zaangażowani

Wtyczka „Prosty własny CSS i JS” została przetłumaczona na 17 języków. Podziękuj tłumaczom za ich wkład.

Przetłumacz wtyczkę “Prosty własny CSS i JS” na swój język.

Interesuje cię rozwój wtyczki?

Przeglądaj kod, sprawdź repozytorium SVN lub czytaj dziennik rozwoju przez RSS.

Rejestr zmian

3.50

  • 02/17/2025
  • Fix: the editor doesn’t show up under certain conditions
  • Fix: don’t show the code excerpts in the list table, if the „Extended View” option is enabled for posts or pages

3.49

  • 11/13/2024
  • Fix: add nuance for the „in Block editor” option for websites with WP before v6.6 and after

3.48

  • 09/24/2024
  • Feature: add JS/CSS custom codes to the Block editor

3.47

  • 05/27/2024
  • Fix: use the GMT time for showing when a custom code was published or modified

3.46

  • 01/31/2024
  • Tweak: update the Bootstrap and jQuery library links
  • Tweak: remove the qTranslate-x warning. The qTranslate-x plugin was removed from wp.org since Aug 2021

3.45

  • 10/17/2023
  • Fix: enqueue the jQuery library only if there is a frontend JS custom code that requires it

3.44

  • 06/07/2023
  • Compatibility with the WooCommerce „custom order tables” feature

3.43

  • 03/13/2023
  • Fix: PHP8.1 deprecation notices
  • Fix: after adding a JS/HTML custom code with empty content will show the CSS default message in the editor

3.42

  • 01/17/2023
  • Fix: the „LH Archived Post Status” plugin was removing the „Publish” button on the add/edit custom code page
  • Feature: multiple values for the „Where in site” option

See changelog for all versions.