Подключение javascript в плагине wordpress (вызов php функции)
Опубликовано: 01.09.2018
Здравствуйте, сегодня продолжим создание wordpress плагина и в данной статье рассмотрим подключение к плагину javascript, а также рассмотрим как заставить работать (вызвать) PHP функцию, которая описана в javascript.
Скачать исходники для статьи можно ниже
Для примера создадим плагин, который будет выводить часы на сайте за основу возьмем следующий javascript:
function checklength(i){ if (i<10) {i="0"+i;} return i; } function clock(){ var now = new Date(); var hours = checklength(now.getHours()); var minutes = checklength(now.getMinutes()); var seconds = checklength(now.getSeconds()); var format = 1; //0=24 hour format, 1=12 hour format var time; if (format == 1){ if (hours >= 12){ if (hours ==12){ hours = 12; }else { hours = hours-12; } time=hours+':'+minutes+':'+seconds+' PM'; }else if(hours < 12){ if (hours ==0){ hours=12; } time=hours+':'+minutes+':'+seconds+' AM'; } } if (format == 0){ time= hours+':'+minutes+':'+seconds; } document.getElementById("clock").innerHTML=time; setTimeout("clock();", 500); }1. Создаем файл moijs.js
How To Add JavaScript To WordPress
Для этого воспользуемся бесплатным редактором кода Notepad++, открываем его и вставляем вышеуказанный код часов и сохраняем его как moijs.js
2. Далее создадим главный файл плагина — например назовем его — pluginjs.php
Также открываем Notepad++, создаем в нем новый файл и вставляем следующий код (за основу возьмем мою предыдущую статью — Создаем простой плагин wordpress: mnogoblogplugin — в ней вы узнаете «что к чему»):
Как добавить javascript в Wordpress
<?php /* Plugin Name: mnogoblogplugin Plugin URI: http://mnogoblog.ru/sozdaem-prostoj-plagin-wordpress Description: Преобразует в каждом слове заголовка первую букву из прописной в заглавную. Version: 1.0 Author: Mnogoblog Author URI: http://mnogoblog.ru */ add_action('init','ava_test_init'); function ava_test_init() { wp_enqueue_script( 'moijs', plugins_url( '/moijs.js', __FILE__ )); } ?>
В вышеуказанном коде мы просто зарегистрировали новый javascript, привязали его к хуку init и указали путь до файла где он храниться — plugins_url( ‘/moijs.js’ — то есть в папке установленного плагина.
Сохраняем файл с названием pluginjs.php.
Теперь у нас есть 2 готовых файла: pluginjs.php и moijs.js — это и есть наш плагин wordpress — далее нам нужно положить их в одну папку и заархивировать (можно воспользоваться бесплатной программой 7-ZIP) — в итоге получаем следующий файл — pluginjs.zip — можно скачать!
3. Заходим в панель управления сайтом и устанавливаем плагин.
Для этого в левом меню выбираем пункт «Плагины» и его подпункт «Добавить новый», далее жмем на ссылку «Загрузить» и выбираем файл pluginjs.zip на своем компьютере, устанавливаем и активируем.4. Теперь в нужном месте сайта нам нужно поставить код, который будет вызывать PHP функцию, код которой прописан в javascript.
По сути нам нужно вызвать функцию «clock()», а вызывать ее можно различными способами:
4.1. с помощью следующего кода:
<script language="javascript"> <!-- clock(); //--> </script>То есть здесь мы опять обращаемся к языку javascript.
4.2. также можно сделать следующим образом:
<input type="button" onclick="clock()" value="Время"/>То есть у нас будет видна кнопочка с надписью «Время», при нажатии на которую появиться время.