ビフォーアフターのプラグインなるものが気になり、
wordpressをどうにかして（無料で）導入しなくては・・と、
随分と調べました。・・が、止めました。

タイトルと内容が合っておりませんでしたので、
表題は変更+記事も大幅に編集しました。

後日の追記：wordpressのインストールをして、
管理画面を開いた途端、
こちらのムラゴンに引っ越してくる以前のブログで
ワードプレスを使っていた時の記憶が蘇りました。。。

wordpressのセキュリティ設定などで恐ろしく
長い時間がかかっていた悪夢の様な日々のこと・・

プラグインという後付け機能が便利なのですが、
ユーザー登録とか、紐付けとか、パスワードとか
ずーっと、やっていかなきゃならない・・

・・・・を、走馬灯のように思い出し・・、
またwordpressを始めてしまうと
時間が壮大にかかってしまう・・と、
「wordpressしか」出来なくなってしまう事への
恐怖感すら湧いてきました。。

完全にトラウマになっています。

分かる人（適度に切り上げ判断が出来る人）には
とても良いシステムなのでしょうが・・。

私は「永遠の初心者」なので、wordpressは無理っす。
合わんっす。

・・で、いっそのこと
htmlとCSS（と、jsファイル？）で出来るような話を
見聞きしたので、やってみる事にしました。

（コピペで出来ました！るかもしれません。）

コピペで出来た方法は、htmlとcssファイルのみでした。

↓こちらのサイト様の御蔭でよく分かりました。ありがとうございました。↓

【CSS】画像のbefore・afterをスライドさせて、比較できるようなUIを作ってみた。
https://qiita.com/degudegu2510/items/d7a081971d1a0f6b4cf3

意味が分からない部分も多々ありますが、
wordpress地獄（蟻地獄のよう）よりは気が楽です。

↑↑
っていう経緯を書き込むのをすっかり忘れていました。
なので、投稿時点では突然、内容が切り替わってしまいましたが・・。
以下は、数日前の記事です。
↓↓

先ず、フレームワークの使用を出来る状態にしなくてはならず、
以下の「jsファイル（？）」をインストールします。

• Node.js、Vue.js、React.js・・初心者向け（React.jsのみ、機能が多い）
• Next.js、Nuxt.js、Gatsby・・難しい、Linux用（Gatsby（シャンプーの名前？）は、静的サイト ジェネレーター）

よくわからないので・・、ＪＤＫという必要なものがセットになったパッケージをＤＬする事に。以下の参考サイト複数の手順を参考にしました。

困ったのは、参考にしたサイトと実際のサイトの表示が違う事です。
サイトリニューアル？しかも、「subscription」とか書いてある。有料？
・・などなど、悩みつつ。

←サブスクリプションと書いてあります。

この様に、日本語に設定したことによって、参考にしたサイト様のカッコいい説明と
微妙に雰囲気が違ってしまい、なんだか逆に分かりにくいという・・。

一度、日本語にしてしまうと、サイトの「地域・言語」を変更しても
日本語になってしまいました。。。しかし、以下の文章は日本語で分かり易い事が
非常に助かりました。（英語でも、「free」とかで分かるとは思いますが、
見つける・理解するのに倍の時間がかかります、多分。）

JDK 19 および JDK 17 バイナリは、 Oracle No-Fee Terms and Conditions の下で、本番環境で無料で使用でき、無料で再配布でき ます。

「無料」という文字は、日本語でとても嬉しかったです！

プログラムを実行するために2段の翻訳機があるようなものだ。日本語から中国語、ドイツ語に翻訳するのではなくて、必ず英語に翻訳してから他の言語に翻訳するイメージになる。

とのことで、たまたま
以下の言葉が偶々気になってメモしていたのですが、
最近こういうこと（シンクロニシティ）多いです。

中二階の原理は、二階の原理を現場（一階）に貫徹しようとすると現場で生まれるねじれ感覚を、中和するために挿入される

ダウンロード→インストールはまだ実行前です・・。
いつまで経っても分からないので、調べる時間がやたらと長くて。
まだこれから（また数日後に追記）です！

今回の検索語は、「amp-image-slider、JDK、インストール、before、after、HTML、CSS、スライド、コピペ、jsファイル、方法、」
などでした。

参考サイト：リンクの確認をしていないので、ご紹介のみです。
リンクは貼っておりません。（迷惑に思われたくないので・・）
【CSS】画像のbefore・afterをスライドさせて、比較できるようなUIを作ってみた。

https://qiita.com/degudegu2510/items/d7a081971d1a0f6b4cf3
Oracle Help Center Learn
https://docs.oracle.com/learn/?lang=ja

【JDK】インストールと環境変数の設定（Windows）
https://qiita.com/probabilityhill/items/31ebb591f795e255c1c7

Windows版Javaのダウンロード
https://www.java.com › ja › download › ie_manual.jsp

WindowsへのJDKインストール方法
https://qiita.com/ko2a/items/69fa8a5366d7449500ca

JDK 19 Documentation（Documentation、Guidesなどが同じページにある）
https://docs.oracle.com/en/java/javase/19/related-resources.html

画像比較のスライダーってどうやるの？やり方を調べてみた
https://worldis.fun/image-comparison-slider/

Windows に Javascript フレームワークをインストールする
https://docs.microsoft.com/ja-jp/windows/dev-environment/javascript/

スタイルシートの作り方
https://www.homepage-tukurikata.com/css/howto-css.html

https://www.msn.com/ja-jp/money/news/%E6%97%A5%E6%9C%AC%E3%81%AE%E5%85%89%E6%98%8E%E3%81%AF-%E4%B8%AD%E4%BA%8C%E9%9A%8E%E3%81%AE%E5%8E%9F%E7%90%86-%E3%81%AB%E3%81%82%E3%82%8A-%E7%B5%8C%E5%96%B6%E5%AD%A6%E3%81%AE%E6%B3%B0%E6%96%97%E3%81%8C%E8%A6%8B%E3%81%84%E3%81%A0%E3%81%99%E5%B8%8C%E6%9C%9B/ar-AA11CAPO?rt=0&ocid=Win10NewsApp&referrerID=InAppShare

日本の光明は「中二階の原理」にあり 経営学の泰斗が見いだす希望

【初心者でもすぐわかる】JDKのインストール方法 Windows編
https://eng-entrance.com/java-install-jdk-windows

【超初心者向け】Javascriptの基本的な書き方講座
https://eng-entrance.com/javascript-write