Simple Custom CSS and 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ę.

Cechy

  • Edytor tekstowy z podświetlaniem składni
  • Dodawaj wstawki wewnątrz kodu strony lub jako plik zewnętrzny
  • Dodawaj wstawki do nagłówka lub stopki kodu strony
  • Dodawaj wstawki CSS oraz JS do warstwy wizualnej strony (frontend) lub do panelu admina
  • Dodawaj dowolną liczbę wstawek
  • Zachowasz zmiany stylistyczne nawet gdy zmieni się Twój motyw

Zrzuty ekranów

  • Manage Custom Codes

  • Add/Edit Javascript

  • Add/Edit CSS

Instalacja

  • Z panelu admina wybierz w menu bocznym Wtyczki -> Dodaj nową
  • W polu wyszukiwarki wpisz „Simple Custom CSS and JS”.
  • Kliknij „Zainstaluj teraz” przy wtyczce „Simple CSS and JS” .
  • Aktywuj wtyczkę.

LUB…

  • Pobierz wtyczkę z tej strony.
  • Zapisz plik .zip na swoim komputerze.
  • Otwórz panel admina, wybierz Plugins -> Dodaj nową.
  • Kliknij na przycisk „Wyślij wtyczkę na serwer”, a następnie wskaż na swoim komputerze pobrany wcześniej plik .zip.
  • Zainstaluj, a następnie aktywuj wtyczkę.

LUB…

  • Pobierz wtyczkę z tej strony.
  • Wypakuj plik .zip na swoim komputerze.
  • Uzyskaj dostęp do plików swojej strony z użyciem serwera FTP lub interfejsu cPanel lub Direct Admin.
  • Przejdź do folderu wp-content/plugins na serwerze.
  • Wgraj na serwer rozpakowany wcześniej na Twoim komputerze folder custom-css-js.
  • Otwórz panel admina, wybierz z menu bocznego Wtyczki, a następnie kliknij na Aktywuj pod nowo dodaną wtyczką Simple Custom CSS and JS.

FAQ

What if I want to add multiple external CSS codes?

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ą.

Will this plugin affect the loading time?

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.

Does the plugin modify the code I write in the editor?

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 Simple Custom CSS and JS jest niezależna od używanego motywu. Wstawki dodane do tej wtyczki będą funkcjonować na każdym aktualnie używanym motywie.

Can I use a CSS preprocesor like LESS or 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');
}

Can I use CSS rules like @import and @font-face?

Tak.

Who can publish/edit/delete Custom Codes?

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.

Kompatybilność z wtyczką qTranslateX

  • W momencie gdy wtyczka qTranslate X dodaje do Twoich wstawek kod pokroju [:] czy też [:en], to musisz usunąć typ posta custom-css-js z ustawień qTranslate. Ten zrzut ekranu ilustruje, jak to zrobić.

My website has HTTPS urls, but the codes are linked as HTTP

The URL for the linked Codes is built just like the URL for other media (from Media Library) by using the WordPress Address option found on the WP Admin -> Settings -> General page, as shown in this screenshot. If the WordPress Address has HTTPS in the url, then the Custom Codes and all the other media will have HTTPS in the url.

Recenzje

22 kwietnia 2021
I love the way this plugin helps you make a css external file at the click of a button. Besides, developer is very reactive and very helpful.
21 kwietnia 2021
I'm very happy with this plugin for several years already. It's one of the first plugins I install on a new WordPress. Never had any problems with it and it works perfectly. Keep on going - great job! *both-thumbs-up*
29 października 2020
No doubt this plugin is good, but I've found that, in the code editor Search is not works properly. This review is for admin to make better the plugin.
27 października 2020
I run my own custom code on the site. So, I must have the solution to do with it. ..and "Simple Custome CSS and JS" is only one of the best for my custom code. Thanks to Silkypress.
Przeczytaj 75 recenzji

Kontrybutorzy i deweloperzy

„Simple Custom CSS and JS” jest oprogramowaniem open source. Poniższe osoby miały wkład w rozwój wtyczki.

Zaangażowani

Wtyczka “Simple Custom CSS and JS” została przetłumaczona na 10 języków. Podziękuj tłumaczom za ich wkład.

Przetłumacz wtyczkę “Simple Custom CSS and JS” na swój język.

Interesuje cię rozwój wtyczki?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Log zmian

3.37

  • 07/12/2021
  • Fix: allow the TablePress plugin to load its JS files on the „Add custom code” page in admin
  • Feature: highlight active line in the editor
  • Feature: add „Ctrl + J” shortcut to the editor for jumping to the matching tag

3.36

  • 02/23/2021
  • Fix: fatal error with PHP8.0

3.35

  • 01/19/2021
  • Tweak: change dummy revision dates to fictional dates before 2000
  • Fix: replace the deprecated postL10n JS object with wp.i18n
  • Fix: add „tipsy-no-html” to the tooltips on the settings page

3.34.1

  • 11/24/2020
  • Fix: PHP error when filtering the custom codes

3.34

  • 11/01/2020
  • Feature: enqueue the jQuery library if one of the JS custom codes requires it
  • Fix: set cookie SameSite attribute to lax

3.33

  • 08/20/2020
  • Fix: the user language preferrence was ignored in favor of the site defined language
  • Fix: allow the jQuery library added by plugins like Enable jQuery Migrate Helper or Test jQuery Updates
  • Fix: permalink was not editable with WordPress 5.5
  • Feature: fullscreen editor
  • Feature: button for beautifying the code

3.32.3

  • 08/02/2020
  • Fix: add „Cmd + ” editor shortcuts for MacOS computers

3.32.2

  • 07/14/2020
  • Fix: use file_get_contents instead of include_once to load the custom codes

3.32

  • 07/08/2020
  • Fix: compatibility issue with the Product Slider for WooCommerce by ShapedPlugin
  • Feature: „Ctrl + /” in the editor will comment out the code
  • Feature: order custom codes table by „type” and „active” state
  • Feature: autocomplete in the editor

3.31.1

  • 05/05/2020
  • Declare compatibility WooCommerce 4.1

3.31

  • 03/21/2020
  • Feature: add „After tag” option for HTML codes, if the theme allows it
  • Feature: don’t show type attribute for script and style tags if the theme adds html5 support for it
  • Code refactory
  • Fix: the permalink was mistakingly showing a „.css” file extension when being edited

3.30

  • 03/12/2020
  • Feature: color the matching brackets in the editor
  • Declare compatibility WooCommerce 4.0
  • Declare compatibility WordPress 5.4

3.29

  • 01/31/2020
  • Fix: date Published and Modified date wasn’t shown in Japanese
  • Feature: indentation in the editor
  • Feature: close brackets in the editor

3.28

  • 11/05/2019
  • Tweak: update the Bootstrap and jQuery library links
  • Declare compatibility with WordPress 5.3

3.27

  • 08/08/2019
  • Compatibility with the „CMSMasters Content Composer” plugin
  • Feature: keep the cursor position after saving
  • Option: remove the comments from the HTML

3.26

  • 05/08/2019
  • Fix: remove the Codemirror library added from WP Core
  • Tweak: use protocol relative urls for custom code linked file
  • Declare compatibility with WordPress 5.2

3.25

  • 04/21/2019
  • Tweak: update the Bootstrap and jQuery library links
  • Declare compatibility with WooCommerce 3.6

3.24

  • 04/05/2019
  • Fix: remove the editor scrollbar
  • Tweak: rename „First Page” to „Homepage” to avoid misunderstandings

3.23

  • 03/15/2019
  • Fix: avoid conflicts with other plugins that use CodeMirror as their editor

3.22

  • 12/06/2018
  • Fix: another solution for the bug related to the Edit Custom Code page was blank for WordPress 5.0 and the Classic Editor enabled

3.21

  • 12/06/2018
  • Fix: the Edit Custom Code page was blank for WordPress 5.0 and the Classic Editor enabled

3.20

  • 11/15/2018
  • Fix: remove compatibility with the Shortcoder plugin. Bug https://wordpress.org/support/topic/edit-page-blank-8/
  • Declare compatibility WooCommerce 3.5

3.19

  • 10/16/2018
  • Fix: keep the editor LTR even on RTL websites
  • Fix: flush rewrite rules after modifying the „Add Web Designer role” option

3.18

  • 07/13/2018
  • Fix: the default comment for JS for other locales than „en_” was removing the tags
  • Tweak: make the search dialog persistent
  • Tweak: correct the tooltip info for the 'ccs_js_designer' option

3.17

  • 25 kwietnia 2018
  • Fix: add the add/edit/delete custom post capabilities to the admin and 'css_js_designer' roles on plugin activation

3.16

  • 22 kwietnia 2018
  • Fix: „The link you followed has expired” on custom code save if the WP Quads Pro plugin is active
  • Poprawka: Ostrzeżenie dla PHP 7.2
  • Change: add/remove the „Web Designer” role only on activating/deactivating the option in the Settings page

3.15

  • 27 marca 2018
  • Change: check the option name against an array of allowed values

3.14

  • 2 kwietnia 2018
  • Nowa funkcja: permalink dla wstawek
  • Poprawka: Ustawienie skryptów ze stopki na wyższy priorytet
  • Aktualizacja tłumaczenia na język francuski
  • Fix: allow admin stylesheets from ACF plugin, otherwise it breaks the post.php page
  • Tweak: for post.php and post-new.php page show code’s title in the page title

3.13

  • 12 stycznia 2018
  • Nowa funkcja: dodanie opcji „Zachowaj tagi HTML, nie konwertuj ich na znaki”

3.12

  • 3 stycznia 2018
  • Reverse to the wp_footer function for the footer scripts, as the print_footer_scripts function is used also in the admin, which lead to many broken back-ends

3.11

  • 3 stycznia 2018
  • Use the print_footer_scripts function for the footer scripts (https://wordpress.org/support/topic/footer-code-position-before-external-scripts-is-overridden/)
  • Escape selectively the HTML characters in the editor (https://wordpress.org/support/topic/annoying-bug-in-text-editor/)

3.10

  • 15 grudnia 2017
  • Poprawka: https://wordpress.org/support/topic/broken-layout-of-code-snippet-type-color-tag-css-html-js-on-main-list-table/
  • Nowa funkcja: filtrowanie po typie wstawki z kodem
  • Nowa funkcja: dodanie sortowania do kolumny „Modyfikowane”
  • Fix: if the default comment remains in the „Add Custom JS”, then there was no tags added to the code, as the comment contained a tag

3.9

  • 1 grudnia 2017
  • Nowa funkcja: dodanie informacji o dacie ostatniej edycji pod edytorem
  • Fix: jump to line when searching
  • Tweak: add message that the Code Revision data is dummy

3.8

  • 19 października 2017
  • Declare compatibility with WooCommerce 3.2 (https://woocommerce.wordpress.com/2017/08/28/new-version-check-in-woocommerce-3-2/)
  • Poprawka: uniknięcie konfliktów z innymi wtyczkami, które implementują edytor CodeMirror
  • Aktualizacja biblioteki CodeMirror do wersji 5.28

3.7

  • 6 października 2017
  • Dodanie tłumaczenia francuskiego i polskiego

3.6

  • 7 września 2017
  • Poprawka: kompatybilność z wtyczką CSS Plus

3.5

  • 25 sierpnia 2017
  • Refaktoring kodu wtyczki
  • Add activate/deactivate link to row actions and in Publish box
  • Make the activate/deactivate links work with AJAX
  • Dodanie tłumaczenia na język turecki

3.4

  • 11 lipca 2017
  • Security fix according to VN: JVN#31459091 / TN: JPCERT#91837758

3.3

  • 23 czerwca 2017
  • Nowa funkcja: opcja dodania wstawek z kodem do strony logowania

3.2

  • 13 czerwca 2017
  • Fix: compatibility issue with the HTML Editor Syntax Highlighter plugin

3.1

  • 14 maja 2017
  • Funkcja: przygotowanie wtyczki do tłumaczeń

3.0

  • 12 kwietnia 2017
  • Feature: create the Web Designer role
  • Feature: allow Custom Codes to be managed only by users with the right capabilities

2.10

  • 5 lutego 2017
  • Feature: circumvent external file caching by adding a GET parameter
  • Add special offer for Simple Custom CSS and JS pro

2.9

  • 5 grudnia 2016
  • Compatibility with WP4.7. The „custom HTML code” was not showing up anymore

2.8

  • 9 października 2016
  • Feature: add search within the editor accessible with Ctrl+F
  • Feature: make the inactive rows opaque

2.7

  • 4 września 2016
  • Fix: there was a space in the htmlmixed.%20js url
  • Feature: make the editor resizable

2.6

  • 31 sierpnia 2016
  • Feature: add HTML code
  • Fix: add htmlentities when showing them in the editor
  • Feature: when adding a code, show more explanations as comments

2.5

  • 25 sierpnia 2016
  • Fix: compatibility with other plugins that interfere with the CodeMirror editor

2.4

  • 1 sierpnia 2016
  • Add the „Add CSS Code” and „Add JS Code” buttons next to the page title
  • Compatibility with WP 4.6: the „Modified” column in the Codes listing was empty

2.3

  • 22 czerwca 2016
  • Add the includes/admin-notices.php and includes/admin-addons.php
  • Feature: change the editor’s scrollbar so it can be caught with the mouse

2.2

  • 22 czerwca 2016
  • Check compatibility WordPress 4.5.3
  • Add special offer for Simple Custom CSS and JS pro

2.1

  • 24 kwietnia 2016
  • Fix: on multisite installs have to create the custom-css-js folder in the upload dir for each site
  • Fix: the deactivate code star wasn’t working when first time clicked
  • Fix: In the add/edit Code page filter which meta boxes are allowed
  • Fix: If the custom-css-js folder is not created of is not writable, issue an admin notice.

2.0

  • 11 kwietnia 2016
  • Feature: enable/disable codes
  • Feature: add a GET parameter at the end of external files in order to over circumvent caching
  • Fix: don’t add the „” tag from the code if already present.

1.6

  • 26 marca 2016
  • Fix: the number of codes were limited because query_posts is automatically inserting a limit

1.5

  • 03/10/2016
  • Fix: solved a conflict with the shortcoder plugin.

1.4

  • 01/04/2016
  • Tweak: Do not enqueue scripts unless we are editing the a custom-css-js type post.
  • Fix: The register_activation_hook was throwing a notice
  • Fix: add window.onload when initializing the CodeMirror editor
  • Tweak: Differentiated the option names for „Where on page” and „Where in site”
  • Fix: set the correct language modes to CodeMirror object
  • Tweak: remove the slug metabox
  • Tweak: use the compressed version of CodeMirror

1.3

  • 12/27/2015
  • Tweak: changed the submenus to „Add Custom CSS” and „Add Custom JS” instead of „New Custom Code”
  • Tweak: Use admin_head instead of admin_enqueue_scripts for external files in order to add priority to the code
  • Fix: The javascript code was not shown
  • Fix: For longer code the last line in the editor was hidding because of the CodeMirrorBefore div.

1.2

  • 12/14/2015
  • Fix: when a code was sent into Trash it still wasn’t shown on the website

1.1

  • 10 grudnia 2015
  • Tweak: for external files use wp_head and wp_footer instead of wp_enqueue_style. Otherwise the CSS and JS is inserted before all the other scripts and are overwritten.
  • Tweak: Save all the codes in files in order to save on database queries
  • Tweak: Rewrite the readme.txt in the form of FAQ for better explanations

1.0

  • 6 grudnia 2015
  • Initial commit