{"id":235,"date":"2024-03-01T16:59:55","date_gmt":"2024-03-01T15:59:55","guid":{"rendered":"https:\/\/intranet.projektninja.com\/?p=235"},"modified":"2024-06-15T15:46:32","modified_gmt":"2024-06-15T13:46:32","slug":"anti-chache-wp","status":"publish","type":"post","link":"https:\/\/projektninja.com\/devblog\/wtyczki-ninja\/anti-chache-wp\/","title":{"rendered":"Wtyczka Ninja Anty-cache Zapobieganie cache’owaniu skrypt\u00f3w w WordPress"},"content":{"rendered":"\n

Czasami od\u015bwie\u017canie i czyszczenie cache, szczeg\u00f3lnie na telefonach, mo\u017ce by\u0107 problematyczne. Aby temu zapobiec, mo\u017cna doda\u0107 losowy parametr GET do adresu skrypt\u00f3w i styl\u00f3w w pliku functions.php<\/code>. Dzi\u0119ki temu przy ka\u017cdym od\u015bwie\u017ceniu przegl\u0105darka widzi inny URL i prze\u0142adowuje pliki od nowa.<\/p>\n\n\n\n

Aby uzale\u017cni\u0107 dodawanie parametru anty-cache od w\u0142\u0105czenia\/wy\u0142\u0105czenia wtyczki, mo\u017cna wykorzysta\u0107 hooki WordPressa wp_enqueue_scripts<\/code> do dynamicznego dodawania lub usuwania wersji w zale\u017cno\u015bci od stanu wtyczki. Oto krok po kroku, jak to zrobi\u0107:<\/p>\n\n\n\n

Stw\u00f3rz now\u0105 wtyczk\u0119:<\/strong>Zacznij od stworzenia pliku PHP dla wtyczki, np. no_cache_toggle.php<\/code> w katalogu wp-content\/plugins<\/code>.<\/p>\n\n\n\n

Dodaj kod do wtyczki:<\/strong>W pliku wtyczki dodaj poni\u017cszy kod, kt\u00f3ry rejestruje wtyczk\u0119 i dodaje parametr anty-cache:<\/p>\n\n\n\n

<?php\n\/*\nPlugin Name: Ninja Anty Cache\nDescription: Toggle cache-busting parameter for scripts and styles.\nVersion: 1.0\nAuthor: Maciej Sajan\nAuthor URI: https:\/\/projektninja.com\/\n*\/\n\n\/\/ Dodaj hook do enque scripts\nfunction add_no_cache_parameter($src) {\n    if (is_admin()) return $src; \/\/ Upewnij si\u0119, \u017ce nie dzia\u0142amy w panelu admina\n    \n    \/\/ Dodaj parametr tylko, gdy wtyczka jest w\u0142\u0105czona\n    if (get_option('no_cache_toggle_enabled')) {\n        $src = add_query_arg('ver', time(), $src);\n    }\n    return $src;\n}\n\nfunction enable_no_cache_toggle() {\n    add_filter('style_loader_src', 'add_no_cache_parameter', 10, 1);\n    add_filter('script_loader_src', 'add_no_cache_parameter', 10, 1);\n}\n\nfunction disable_no_cache_toggle() {\n    remove_filter('style_loader_src', 'add_no_cache_parameter', 10, 1);\n    remove_filter('script_loader_src', 'add_no_cache_parameter', 10, 1);\n}\n\n\/\/ Hook do w\u0142\u0105czania wtyczki\nregister_activation_hook(__FILE__, 'enable_no_cache_toggle');\n\/\/ Hook do wy\u0142\u0105czania wtyczki\nregister_deactivation_hook(__FILE__, 'disable_no_cache_toggle');\n\n\/\/ Sprawd\u017a czy opcja jest ustawiona, gdy wtyczka jest w\u0142\u0105czona\nif (get_option('no_cache_toggle_enabled')) {\n    enable_no_cache_toggle();\n}\n\n\/\/ Zarejestruj opcj\u0119 podczas aktywacji wtyczki\nfunction activate_no_cache_toggle() {\n    update_option('no_cache_toggle_enabled', 1);\n}\nregister_activation_hook(__FILE__, 'activate_no_cache_toggle');\n\n\/\/ Usu\u0144 opcj\u0119 podczas deaktywacji wtyczki\nfunction deactivate_no_cache_toggle() {\n    delete_option('no_cache_toggle_enabled');\n}\nregister_deactivation_hook(__FILE__, 'deactivate_no_cache_toggle');\n<\/code><\/pre>\n\n\n\n
Aktywacja wtyczki:<\/strong>Przejd\u017a do panelu admina WordPressa, w sekcji “Wtyczki” znajd\u017a swoj\u0105 wtyczk\u0119 “No Cache Toggle” i j\u0105 aktywuj.<\/p>\n\n\n\n
Testowanie:<\/strong>Teraz, gdy wtyczka jest aktywna, powiniene\u015b zobaczy\u0107, \u017ce do skrypt\u00f3w i styl\u00f3w dodawany jest parametr ver<\/code> z aktualnym timestampem, co powoduje brak cache’owania. Gdy wy\u0142\u0105czysz wtyczk\u0119, parametr nie b\u0119dzie dodawany i strona powinna \u0142adowa\u0107 si\u0119 szybciej.<\/p>\n\n\n\n
Ten spos\u00f3b u\u017cywa hook\u00f3w register_activation_hook<\/code> i register_deactivation_hook<\/code> do zarz\u0105dzania stanem wtyczki oraz dodawania i usuwania filtru, kt\u00f3ry modyfikuje URL-e skrypt\u00f3w i styl\u00f3w.<\/p>\n\n\n\n
Wtyczka do pobrania:<\/p>\n\n\n\n
ninja-anty-cache<\/a>Pobierz<\/a><\/div>\n\n\n\n
Przydatne linki<\/h3>\n\n\n\n
    \n
  1. Tworzenie wtyczek w WordPress<\/a><\/strong><\/li>\n\n\n\n
  2. Dokumentacja WordPress Hooks<\/a><\/strong><\/li>\n\n\n\n
  3. Optymalizacja WordPress<\/strong><\/a><\/li>\n<\/ol>\n\n\n\n
    Anty-cache Zapobieganie cache’owaniu w WordPress: Dodanie losowego parametru GET
    Starsza wersja opcja na szybko<\/h2>\n\n\n\n
    Kod PHP<\/strong>:<\/p>\n\n\n\n
    function custom_theme_features()  {\n\n\t\/\/ Add theme support for custom CSS in the TinyMCE visual editor\n\tadd_editor_style();\n}\nadd_action( 'after_setup_theme', 'custom_theme_features' );\n\n\n\n\nfunction enqueue_custom_styles_and_scripts() {\n    \n    $random_parameter = rand(5, 99999); \/* <--- randomowa liczba *\/\n    \n    wp_enqueue_style('custom-style', get_template_directory_uri() . '\/style.css?'.$random_parameter); \/* <--- tu dodana jako argument GET *\/\n    wp_enqueue_script('custom-script', get_template_directory_uri() . '\/js\/skrypty.js?'.$random_parameter); \/* <--- tu dodana jako argument GET *\/\n    wp_enqueue_script('gsap', 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.2\/gsap.min.js', array(), '1.0', true);\n    wp_enqueue_script('scrolltoplugin', 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.2\/ScrollToPlugin.min.js', array(), '1.0', true);\n}\nadd_action('wp_enqueue_scripts', 'enqueue_custom_styles_and_scripts');<\/code><\/pre>\n\n\n\n
    Wyja\u015bnienia:<\/h3>\n\n\n\n
      \n
    1. Dodanie funkcji wsparcia motywu<\/strong>: Funkcja custom_theme_features<\/code> dodaje wsparcie dla niestandardowego CSS w edytorze wizualnym TinyMCE.<\/li>\n\n\n\n
    2. Enqueue styl\u00f3w i skrypt\u00f3w z losowym parametrem GET<\/strong>: Funkcja enqueue_custom_styles_and_scripts<\/code> generuje losowy parametr GET i dodaje go do adres\u00f3w styl\u00f3w i skrypt\u00f3w, co zapobiega ich cachowaniu.<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"
      Dowiedz si\u0119, jak zapobiec cachowaniu skrypt\u00f3w i styl\u00f3w w WordPress, dodaj\u0105c losowy parametr GET do adresu.<\/p>\n","protected":false},"author":1,"featured_media":430,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[259],"tags":[165,110,29,164,32,163,28,149,137,13,61],"class_list":["post-235","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wtyczki-ninja","tag-anty-cache","tag-cache","tag-functions-php","tag-odswiezanie","tag-php","tag-skrypty","tag-style","tag-tutorial","tag-web-development","tag-wordpress","tag-wtyczka"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/posts\/235","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/comments?post=235"}],"version-history":[{"count":10,"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/posts\/235\/revisions"}],"predecessor-version":[{"id":627,"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/posts\/235\/revisions\/627"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/media\/430"}],"wp:attachment":[{"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/media?parent=235"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/categories?post=235"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/projektninja.com\/devblog\/wp-json\/wp\/v2\/tags?post=235"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}