WordPress.org
Get WordPress

Plugin Directory

Changeset 3477309


Ignore:
Timestamp:
03/08/2026 08:22:14 AM (4 weeks ago)
Author:
wedok
Message:

Update plugin to version 1.6.2

Location:
wepop/trunk
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • wepop/trunk/css/popup.css

    r3416066 r3477309  
    11/*!
    22 * WePOP - Lightweight Image & Video Popup Plugin for WordPress
    3  * Version: 1.6.1
     3 * Version: 1.6.2
    44 * Author: WeDOK (https://wedok.jp)
    55 * License: GPLv2 or later
    … …  
    3131
    3232.wepop-content {
    33   max-width: 90vw;
    34   max-height: 90vh;
     33  /* 固定サイズのコンテナで常に中央配置を維持 */
     34  width: 90vw;
     35  height: 90vh;
    3536  position: relative;
    3637  display: flex;
    … …  
    4041
    4142.wepop-img-container {
    42   width: 100%;
    43   height: 100%;
     43  /* 固定サイズで中央配置を維持 */
     44  width: 90vw;
     45  height: 90vh;
    4446  position: relative;
    45   overflow: hidden;
     47  overflow: visible;
    4648  display: flex;
    4749  justify-content: center;
    4850  align-items: center;
    49   transition: width .35s ease-out, height .35s ease-out;
    5051}
    5152
    5253.wepop-img {
    53   max-width: 100%;
     54  /* 絶対配置で常に中央に固定 */
     55  position: absolute;
     56  top: 50%;
     57  left: 50%;
     58  transform: translate(-50%, -50%);
     59  transform-origin: center center;
     60  max-width: 90vw;
    5461  max-height: 90vh;
    5562  width: auto;
    5663  height: auto;
    5764  object-fit: contain;
    58   will-change: transform;
    59   transition: transform .35s ease-out;
     65  will-change: transform, opacity;
     66  /* transformとopacity両方にトランジションを適用 */
     67  transition: transform .35s ease-out, opacity .35s ease-out;
    6068  backface-visibility: hidden;
    6169  -webkit-backface-visibility: hidden;

  • wepop/trunk/js/popup.js

    r3416066 r3477309  
    127127    altBox.className = "wepop-alt-text";
    128128    altBox.textContent = alts[index] || "";
    129     content.appendChild(altBox);
     129    overlay.appendChild(altBox);
    130130  }
    131131
    … …  
    166166  });
    167167
     168  // 画像・矢印・閉じるボタン以外をクリックしたら閉じる
     169  img.addEventListener("click", (e) => e.stopPropagation());
     170  container.addEventListener("click", (e) => {
     171    if (!e.target.closest(".wepop-img")) {
     172      closePopup(overlay);
     173    }
     174  });
     175
    168176  function changeImage(dir) {
    169177    var currentImg = container.querySelector(".wepop-img");
    170178    var nextIndex = (index + dir + urls.length) % urls.length;
    171 
    172     container.style.height = container.offsetHeight + "px";
    173     container.style.width = container.offsetWidth + "px";
    174179
    175180    var nextImg = document.createElement("img");
    … …  
    177182    nextImg.src = urls[nextIndex];
    178183    nextImg.alt = alts[nextIndex] || "";
    179     nextImg.style.transform = dir > 0 ? "translateX(100%)" : "translateX(-100%)";
    180184    nextImg.style.position = "absolute";
    181     nextImg.style.top = "0";
    182     nextImg.style.left = "0";
     185    nextImg.style.top = "50%";
     186    nextImg.style.left = "50%";
     187    nextImg.style.transform = dir > 0
     188      ? "translate(-50%, -50%) translateX(30%)"
     189      : "translate(-50%, -50%) translateX(-30%)";
     190    nextImg.style.opacity = "0";
     191
     192    currentImg.style.position = "absolute";
     193    currentImg.style.top = "50%";
     194    currentImg.style.left = "50%";
     195    currentImg.style.transform = "translate(-50%, -50%)";
    183196
    184197    container.appendChild(nextImg);
    185198
    186199    var loadHandler = () => {
    187       var w = nextImg.naturalWidth;
    188       var h = nextImg.naturalHeight;
    189 
    190       container.style.width = w + "px";
    191       container.style.height = h + "px";
    192 
    193200      requestAnimationFrame(() => {
    194         currentImg.style.transform = dir > 0 ? "translateX(-100%)" : "translateX(100%)";
    195         nextImg.style.transform = "translateX(0)";
     201        currentImg.style.transform = dir > 0
     202          ? "translate(-50%, -50%) translateX(-30%)"
     203          : "translate(-50%, -50%) translateX(30%)";
     204        currentImg.style.opacity = "0";
     205        nextImg.style.transform = "translate(-50%, -50%)";
     206        nextImg.style.opacity = "1";
    196207      });
    197208
    … …  
    200211        () => {
    201212          currentImg.remove();
    202           nextImg.style.position = "relative";
    203           container.style.height = "";
    204           container.style.width = "";
    205213          index = nextIndex;
    206214          if (altBox) altBox.textContent = alts[index] || "";

  • wepop/trunk/readme.txt

    r3425955 r3477309  
    11=== WePOP ===
    22Contributors: wedok
    3 Tags: lightbox, image popup, video popup, gallery, responsive
     3Tags: lightbox, popup, gallery, image, video
    44Requires at least: 5.0
    5 Tested up to: 6.9
     5Tested up to: 6.9.1
    66Requires PHP: 7.4
    7 Stable tag: 1.6.1
     7Stable tag: 1.6.2
    88License: GPLv2 or later
    99License URI: https://www.gnu.org/licenses/gpl-2.0.html
    1010
    11 Lightweight, jQuery-free popup plugin for images and videos (YouTube, Vimeo, MP4). Simple, responsive, and dependency-free.
     11A lightweight, dependency-free lightbox plugin for WordPress. Supports images and videos without jQuery.
    1212
    1313== Description ==
    1414
    15 **WePOP** is a lightweight, jQuery-free popup plugin for WordPress. 
    16 It displays images or videos in a clean, responsive popup viewer — without relying on external libraries or shortcodes.
     15**WePOP** is a lightweight, dependency-free popup plugin for WordPress. It supports images and videos without jQuery. [cite: 2, 3]
    1716
    18 Built entirely with pure JavaScript, WePOP provides long-term reliability and stable performance across modern themes.
     17Built entirely with pure JavaScript, WePOP provides long-term reliability and stable performance across modern themes. [cite: 4] Unlike traditional plugins, it has zero external dependencies, meaning it won't break when your theme or other plugins update. [cite: 3, 24]
    1918
    20 WePOP offers 3 popup grouping modes, allowing you to control how images are organized inside a page. 
    21 This is especially useful for websites that contain **multiple galleries on a single page**, such as portfolios, photography sites, and restaurant menus.
     19WePOP offers 3 popup grouping modes, giving you full control over how your galleries are organized. [cite: 5, 12] This is especially useful for websites that contain multiple galleries on a single page, such as portfolios, photography sites, and restaurant menus. [cite: 6]
    2220
    23 WePOP is developed by **WeDOK (Kazuhiro Konta)**, a Japanese creator with real-world client experience, focusing on essential functionality and consistent usability.
     21== Why Choose WePOP? ==
     22* Rock-Solid Stability: Pure JavaScript implementation ensures no conflicts with other libraries. [cite: 3, 24]
     23* Lightweight & Fast: Minimal footprint. No unnecessary scripts or database bloat. [cite: 2, 7]
     24* Intuitive UX: Version 1.6.2 introduces smooth transitions even between images of different sizes. [cite: 39]
     25* Developer Friendly: Clean architecture that works seamlessly with modern WordPress blocks. [cite: 4, 30]
    2426
    25 ### ⚙️ New Features in 1.6.1
    26 
    27 - Added popup support for **YouTube / Vimeo / MP4 videos** 
    28 - Added the ability to **disable popup** for individual images via the block sidebar 
    29 - Added improved file-type detection for safer popup activation 
    30 - Improved behavior for grouped slideshows with smoother transitions 
    31 - Added basic information section in the settings screen 
    32 - Updated translations for all supported languages
     27== Documentation & Support ==
     28* [Official Japanese Documentation (公式マニュアル)](https://wedok.jp/tools/wepop/)
    3329
    3430---
    3531
    36 ### ⚙️ Popup Trigger Rules
    37 
    38 WePOP automatically detects the link target and triggers the popup only when the URL points to:
    39 
    40 - Image files (jpg, jpeg, png, gif, webp) 
    41 - Video URLs (YouTube / Vimeo) 
    42 - MP4 files 
    43 
    44 If the linked file type is not supported, the popup will not activate. 
    45 This prevents unexpected behavior with external URLs or non-media links.
    46 
    47 ※ YouTube/Vimeo videos may restrict playback depending on the video's privacy settings. 
    48 Some videos cannot be embedded by third-party websites.
     32== What's New in 1.6.2 ==
     33* Smooth Transitions: Improved animation logic for grouped galleries and varying image sizes. [cite: 39]
     34* Smart Alt Text: Captions are now styled perfectly beneath the image and automatically hide when empty. [cite: 39]
     35* Reliable Closing: Fixed popup closing behavior when clicking the mask area. [cite: 39]
    4936
    5037---
    5138
    52 ### ⚙️ Popup Mode
    53 
    54 You can choose how images are grouped into popup viewers:
    55 
    56 - **Gallery Blocks Grouping Mode** 
    57   Only images inside **WordPress Gallery blocks** are grouped into slideshows. 
    58   Multiple gallery blocks become separate groups. 
    59   Other images open individually.
    60 
    61 - **All Images Grouping Mode** 
    62   All images in the post are grouped together, regardless of placement.
    63 
    64 - **No Grouping Mode** 
    65   Every image opens individually with no navigation arrows.
    66 
    67 ※ Gallery grouping settings can be changed from the plugin settings.
     39== Popup Trigger Rules ==
     40WePOP intelligently detects the link target and triggers the popup only for: [cite: 10]
     41* Image files: jpg, jpeg, png, gif, webp [cite: 3, 9]
     42* Video URLs: YouTube, Vimeo [cite: 9]
     43* Direct Video: MP4 files [cite: 9]
    6844
    6945---
    7046
    71 ### ⚙️ Show Alt Text
    72 
    73 Displays the image **alt attribute** beneath the popup image. 
    74 This improves accessibility and allows simple captions without custom fields.
     47== Popup Mode Settings ==
     48You can choose how images are grouped into popup viewers: [cite: 12]
     49* Gallery Blocks Grouping Mode: Only images inside WordPress Gallery blocks are grouped into slideshows. [cite: 13]
     50* All Images Grouping Mode: All images in the post are grouped together. [cite: 15]
     51* No Grouping Mode: Every image opens individually with no navigation arrows. [cite: 16]
    7552
    7653---
    7754
    78 ### 🌐 Language Support
     55== Language Support ==
     56Admin labels are fully localized for a global audience. [cite: 19]
     57Supported languages: [cite: 20]
    7958
    80 WePOP supports multilingual admin labels. 
    81 You can switch the plugin language from the settings screen.
    82 
    83 Supported languages:
    84 
    85 - 🇯🇵 Japanese 
    86 - 🇺🇸 English 
    87 - 🇪🇸 Spanish 
    88 - 🇫🇷 French 
    89 - 🇩🇪 German 
    90 - 🇨🇳 Chinese (Simplified) 
    91 - 🇮🇹 Italian 
    92 - 🇰🇷 Korean 
     59- 🇯🇵 Japanese
     60- 🇺🇸 English
     61- 🇪🇸 Spanish
     62- 🇫🇷 French
     63- 🇩🇪 German
     64- 🇨🇳 Chinese (Simplified)
     65- 🇮🇹 Italian
     66- 🇰🇷 Korean
    9367- 🇧🇷 Portuguese (Brazil)
    9468
    95 ---
     69== Installation ==
     701. From WordPress Admin: Go to Plugins → Add New.
     712. Search for WePOP, click Install Now, then Activate.
     723. Configure settings via Settings → WePOP.
    9673
    97 ### 📝 WePOP Official Japanese Documentation 
    98 https://wedok.jp/tools/wepop/
    99 
    100 ---
    101 
    102 WePOP is ideal for developers, photographers, designers, and creators who need a **fast, clean, reliable popup tool** 
    103 without the bloat or complexity of traditional lightbox plugins.
    104 
    105 == Installation ==
    106 
    107 1. From WordPress Admin:
    108    - Go to **Plugins > Add New**
    109    - Search for **WePOP**
    110    - Click **Install Now**, then **Activate**
    111    - Configure via **Settings > WePOP**
    112 
    113 2. Manual Installation:
    114    - Upload the `wepop` folder to `/wp-content/plugins/`
    115    - Activate from the Plugins menu
    116    - Configure via **Settings > WePOP**
    117 
    118 Once activated, WePOP automatically handles any supported media links.
     74Once activated, WePOP automatically handles any supported media links.
    11975
    12076== Screenshots ==
    121 
    122 1. Plugin settings screen 
    123 2. Per-image “Disable Popup” toggle in the editor 
    124 3. Single image popup display 
    125 4. Grouped gallery slideshow with navigation arrows 
    126 5. YouTube popup example 
    127 6. Vimeo popup example 
    128 7. MP4 popup example 
     771. Plugin settings screen
     782. Per-image “Disable Popup” toggle in the editor
     793. Single image popup display
     804. Grouped gallery slideshow with navigation arrows
     815. YouTube popup example
     826. Vimeo popup example
     837. MP4 popup example
     848. Smart Alt text display (Automatically hides when empty)
    12985
    13086== Frequently Asked Questions ==
    13187
    13288= 1. Does WePOP require jQuery? =
    133 No. WePOP uses pure vanilla JavaScript and has zero external dependencies.
     89No. WePOP uses pure vanilla JavaScript and has zero external dependencies. [cite: 23, 24]
    13490
    13591= 2. Why does YouTube/Vimeo say “This video cannot be played”? =
    136 Some videos cannot be embedded on external sites due to the uploader’s settings. 
    137 In such cases, the popup will open but playback may not be allowed.
     92Some videos cannot be embedded on external sites due to the uploader’s privacy settings. [cite: 25, 26, 27]
    13893
    13994= 3. Why doesn't the popup work on my site? =
    140 The most common reasons are:
    141 - Caching plugins that **combine or minify JavaScript/CSS** 
    142 - Plugins that rewrite HTML output 
    143 - Themes that forcibly intercept link behavior 
    144 
    145 If WePOP stops working, try disabling:
    146 - JS/CSS minification 
    147 - Script combination 
    148 - Lazy-loading that wraps images inside additional tags 
     95Common reasons include caching plugins that minify/combine scripts or themes that intercept link behavior. [cite: 28]
    14996
    15097= 4. Does it work with Classic Editor? =
    151 Yes. 
    152 Gallery grouping works only with Gutenberg Gallery blocks, but popups function normally.
     98Yes. Popups function normally, though Gallery grouping is optimized for Gutenberg. [cite: 29, 30]
    15399
    154 = 5. Will it work on older WordPress versions? =
    155 Recommended: WordPress **5.0+** 
    156 Earlier versions may work, but Gutenberg gallery features may be limited.
    157 
    158 = 6. Does it support gallery plugins like NextGEN? =
    159 Image popups may work, but **grouping will not**, because NextGEN outputs custom HTML.
    160 
    161 = 7. Notes about MP4 video popups =
    162 When using MP4 videos with WePOP:
    163 
    164 1. Upload the MP4 file to the WordPress Media Library.
    165 2. Insert the video or image link using the Media Library file URL.
    166 3. Avoid linking directly to external MP4 files or streaming servers.
    167 
    168 External MP4 URLs may fail due to server configuration, MIME type issues, or browser security restrictions.
     100= 5. Does it support gallery plugins like NextGEN? =
     101Image popups may work, but grouping will not due to custom HTML output. [cite: 32]
    169102
    170103== Changelog ==
     104= 1.6.2 =
     105- Improved slideshow transitions for images with different sizes [cite: 39]
     106- Improved slide animation for grouped galleries [cite: 39]
     107- Updated alt text display position and styling [cite: 39]
     108- Alt text element is now hidden when empty [cite: 39]
     109- Fixed popup closing behavior when clicking the mask area [cite: 39]
    171110
    172111= 1.6.1 =
    173 - Added popup support for YouTube, Vimeo, and MP4 videos  
    174 - Added per-image “Disable Popup” option in the editor sidebar  
    175 - Improved file-type detection and popup trigger logic  
    176 - Enhanced slideshow transitions when grouping is enabled  
    177 - Added basic information display in the settings screen  
    178 - Updated translations and improved language consistency  
     112- Added popup support for YouTube, Vimeo, and MP4 videos [cite: 8, 37]
     113- Added per-image “Disable Popup” option in the editor sidebar [cite: 37]
     114- Improved file-type detection and popup trigger logic [cite: 37]
     115- Enhanced slideshow transitions when grouping is enabled [cite: 37]
     116- Added basic information display in the settings screen [cite: 37]
     117- Updated translations and improved language consistency [cite: 37]
    179118
    180119= 1.6.0 =
    181 - Added Popup Mode setting (Gallery / All / None) 
    182 - Added swipe navigation on smartphones 
    183 - Disabled background scrolling while popup is open 
    184 - Added 3 new languages: Italian, Korean, Portuguese (Brazil) 
    185 - Updated translation template 
     120- Added Popup Mode setting (Gallery / All / None)
     121- Added swipe navigation on smartphones
     122- Disabled background scrolling while popup is open
     123- Added 3 new languages: Italian, Korean, Portuguese (Brazil)
     124- Updated translation template
    186125
    187126= 1.5.4 =
    188 - Updated wording for “No grouping” mode 
    189 - Added missing gettext wrappers 
    190 - Updated .pot and ja_JP translation files 
     127- Updated wording for “No grouping” mode
     128- Added missing gettext wrappers
     129- Updated .pot and ja_JP translation files
    191130
    192131= 1.5.3 =
    193 - Added image grouping mode setting 
    194 - Standalone images open individually in gallery mode 
    195 - Improved multilingual loading system 
    196 - Updated translations 
     132- Added image grouping mode setting
     133- Standalone images open individually in gallery mode
     134- Improved multilingual loading system
     135- Updated translations
    197136
    198137= 1.5.2 =
    199 - Corrected data-wepop attribute naming  
    200 - Improved documentation and translations  
     138- Corrected data-wepop attribute naming [cite: 38]
     139- Improved documentation and translations [cite: 38]
    201140
    202141= 1.5.1 =
    203 - Improved multilingual interface 
    204 - Updated settings UI 
     142- Improved multilingual interface
     143- Updated settings UI
    205144
    206145= 1.5 =
    207 - First public release 
     146- First public release
    208147
    209148== Upgrade Notice ==
     149= 1.6.2 =
     150Improved slideshow transitions and popup closing behavior. [cite: 39]
    210151
    211152= 1.6.1 =
    212 New video popup support and improved grouping behavior. 
    213 Recommended for all users.
    214 
     153New video popup support and improved grouping behavior. Recommended for all users.
Note: See TracChangeset for help on using the changeset viewer.