=== HATATATE ===
Contributors: kaoruyakabi
Tags: call to action, cta, banner, ab testing, conversion
Requires at least: 6.0
Tested up to: 7.1
Stable tag: 1.1.2
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html

Show one CTA banner on every post: in the content, the sidebar, a modal or a fixed bar. Run an A/B test and read the report.

== Description ==

HATATATE puts one call-to-action (CTA) on all of your posts without editing each post. A CTA can be a banner, an ad tag or a text link.

**What it does**

* **Create a banner.** Register a CTA (HTML, image or text) in the CTA library. Ad code from an affiliate network is kept as you pasted it, as long as the CTA's author (its `post_author`) may post unfiltered HTML (the same rule WordPress applies to post content).
* **Choose where it appears.** Pick a position: before or after the content, after a heading, before the table of contents, in the sidebar, as a modal, or as a fixed bar at the bottom of the screen. You can also click an element on one of your posts to add a custom position.
* **It shows on every post.** Save the placement once and the CTA appears on all published posts. Change the position later and every post follows.
* **Decide it per post.** Turn the CTA on or off for a specific post, page, category or tag from the "Per page" tab. Categories and tags are listed inside the plugin, so you do not leave the screen.
* **A/B test.** Compare two CTAs in the same position. The report uses a Bayesian estimate so you can stop the test when one is clearly better.
* **Report.** Impressions (50% visible for 1 second) and clicks are counted on your own site and shown per CTA, per position and per day. Your own visits are left out while you are logged in with an account that can write posts.

**First run**

1. Open "HATATATE" in the admin menu. The Home tab lists what to do next.
2. Create one CTA in the CTA library.
3. Open the placement, choose a position, switch it on, and open one of your posts to confirm.

**How the plugin is shaped**

* You configure one placement: a list of positions, each with the CTA that goes there. The same placement is used on the whole site. Per-post, per-category and per-tag settings only turn it on or off.
* You can create as many A/B tests as you like. One position runs one test at a time; a second test in the same position waits until you pause or finish the first.

**For tag managers and analytics**

Every CTA is wrapped in an element with `id="hatatate-cta-<ID>"` and `data-hatatate-cta="<ID>"` (the CTA's post ID). If the same CTA appears twice on one page, the second element gets `-2` appended to its id while the data attribute stays the same. Use the data attribute when you set up click triggers in Google Tag Manager.

**Requirements and what it does not do**

* WordPress 6.0 or later, PHP 7.4 or later.
* The content positions rely on the `the_content` filter. Themes or page builders that render posts without it will not show in-content CTAs (sidebar, modal and fixed bar still work).
* Positions that depend on a table of contents work with plugins and themes that output a `p-toc`, `toc_container` or `ez-toc-container` element.
* The admin screens are in Japanese.
* A CTA is printed as it was saved only when its author (its `post_author`) has the `unfiltered_html` capability, which is the rule WordPress core uses for post content and for the Custom HTML widget. For everyone else the markup goes through `wp_kses()` with an explicit list of allowed tags, and `<script>` is dropped. Nobody has the capability when `DISALLOW_UNFILTERED_HTML` is defined, and on multisite only network administrators have it.

HATATATE Pro, a separate paid add-on, lets you use a different placement pattern for each post, category or tag: https://border-haze.co.jp/tools/hatatate-pro/

== External services ==

This plugin does not send data about your site or its visitors to any external service. Impressions and clicks are stored in your own database and sent to your own site's REST API (`hatatate/v1/track`).

The plugin fetches images from third-party hosts (for example an affiliate network's image server) only to render a preview snapshot of a CTA's own content, and only for the image URLs written in that CTA's own HTML. This can happen in three places, all of them administrator-only:

* When an administrator edits a CTA in the block editor, a snapshot of it is captured automatically.
* On the CTA screen, a CTA whose snapshot is out of date is re-captured automatically when the screen is opened.
* When an administrator starts an A/B test, a snapshot of each side is captured.

Nothing about your site is sent in these requests beyond the image URL being fetched, and requests to private or reserved IP addresses are refused.

== Third-party libraries ==

These libraries are bundled unmodified in `admin/lib/` and are all under a GPL-compatible license. The full license text of each one is in `admin/lib/LICENSES/`, together with the bundled version and where the file was obtained.

* Chart.js 4.5.1 - MIT (`admin/lib/LICENSES/chart.js-MIT.txt`). The file header reads "Released under the MIT License".
* Lucide 1.47.0 - ISC (`admin/lib/LICENSES/lucide-ISC.txt`). The file header reads "@license lucide v1.47.0 - ISC". The 15 individual SVG icon files in `admin/icons/` (all except `symbol-menu.svg` and `symbol-mono.svg`, which are this plugin's own logo) are single icons extracted unmodified from the same Lucide release; the same license file covers them.
* html2canvas 1.4.1 - MIT (`admin/lib/LICENSES/html2canvas-MIT.txt`). The file header reads "Released under MIT License". It bundles tslib, which is licensed under 0BSD by Microsoft.
* `tailwind.css` is not a third-party file as shipped: it is a stylesheet this plugin compiles with Tailwind CSS 3.4.17 (MIT, `admin/lib/LICENSES/tailwindcss-MIT.txt`). See "Source code" below for how to rebuild it.

== Source code ==

`admin/lib/tailwind.css` is minified, so the files it is built from are included in the plugin: `admin/lib/src/tailwind-source.css` (the input) and `admin/lib/src/tailwind.config.js` (the build configuration, which also carries the exact command). Running that command with Tailwind CSS 3.4.17 from the plugin root reproduces the shipped file byte for byte. Every other file in the plugin is shipped in its readable form.

== Installation ==

1. Install it from the plugin directory, or upload the ZIP through Plugins > Add New > Upload Plugin.
2. Activate it. Two tables are created for the counters.
3. Open "HATATATE" in the admin menu and follow the Home tab.

== Frequently Asked Questions ==

= What data does this plugin store? =

Everything stays in your own WordPress database. The plugin stores impressions, clicks, the page URL and the page title of the post where a CTA was shown, together with the CTA, the placement and the date. No personal data is stored: the visitor's IP address and user agent are turned into a one-way hash that is kept in a transient for a few seconds only, so that a reload or a double click is not counted twice, and the hash is discarded after that. Nothing is ever sent to us or to any other service.

= Does it slow down my site? =

No external request is made when a post is displayed. Two small scripts (about 4 KB for showing the CTA and about 10 KB for counting) are loaded with `defer`, and counts are sent to your own site's REST API.

= Does uninstalling remove my data? =

No. CTAs, the placement, A/B tests and counters stay in the database so that you can reinstall without losing them. Delete them from the admin screen first if you want them gone.

= The CTA does not appear in the content =

Check that the placement is switched on (the switch at the top of the Placement tab) and that the theme outputs posts through `the_content`. Then open the placement and use "Check this position" to see how many posts match.

= Can I show the CTA on only one post? =

Yes. On the Placement tab, turn off "Show on posts without a setting". Then on the Per page tab, turn the setting on for the post you want and choose "show".

= My ad code does not appear =

Ad code that draws itself with JavaScript is kept only when the CTA's author (its `post_author`) may post unfiltered HTML. Administrators and editors may do so on a single site; on multisite only network administrators may, and nobody may when `DISALLOW_UNFILTERED_HTML` is defined in `wp-config.php`. In every other case `<script>` is removed before the CTA is printed. The CTA library marks the affected CTAs, so you can see which ones lose their code.

== Screenshots ==

1. Home: what to do next, the three counters and the recent results.
2. Placement: choose the position, preview it on one of your posts, and switch delivery on.
3. Per page: turn the CTA on or off for a post, a category or a tag without leaving the plugin.
4. A/B test: two CTAs in one position and the verdict in one sentence.
5. A CTA shown after the content of a post.
6. The same CTA shown as a modal.

== Changelog ==

= 1.1.2 =
* Fix: on a modal or a fixed button, the Wrapper ID was set on the outer box that also holds the close button (×). A tag manager that reads the nearest ID above the clicked element counted a click on × as a click on the CTA, and counted clicks on the CTA itself under the automatic ID instead of the Wrapper ID. The Wrapper ID is now set on the element that wraps the CTA, in every position, and the close button is outside that element.
* If you use a Wrapper ID in Google Tag Manager or a similar tool, check your triggers after updating: clicks and views of the CTA are now recorded under the Wrapper ID, clicks on × are no longer recorded under it, and on a CTA that has a Wrapper ID the automatic ID (hatatate-cta-<ID>) has moved from the id attribute to the data-hatatate-instance attribute.
* When the same Wrapper ID is used twice on one page, the second one gets "-2" (then "-3"), so the IDs on the page stay unique. The two CTAs of an A/B test share one Wrapper ID, because only one of them stays on the page.

= 1.1.1 =
* Fix: when two or more CTAs were placed at the same position inside the post (before the content, after the content, or a custom position), only the first one was shown. All of them are now shown, in the order you arrange them in the placement pattern. The preview on the placement screen shows the same order.
* When two or more modals appear in the same corner, or two or more fixed buttons appear at the bottom of the screen, the one placed higher in the placement pattern is now shown in front.

= 1.1.0 =
* The Home tab has a short news box at the bottom with tips and news. Its text ships with the plugin; nothing is loaded from outside.
* Fix: a modal set to fade in at the center of the screen went back to sliding in from the right after saving. The display style you choose is now kept.

= 1.0.0 =
* Initial release.
