webpに対応しましたプラグインでカバーしました。 Safariめ!!

2020.01.25

Logging

WebP Express(ウェッピーエクスプレス)というWordPressのプラグインがあるので、そちらでコンバート(変換)すれば良いのですが、大量に画像があるサイトはそれで変換できないので下記の対応方法で対応をお願いします。

1. WebP Express使用してコンバートする際に webpが生成されます。webpの生成場所を確認する。現在は下記の配下にwebp画像が作られています。

/wp-content/webp-express/webp-images/doc-root/wp-content/uploads

2.1の配下にwebpの画像を生成するために下記のコマンドを実行します。自分の場合、アップロードしている画像をリスト化して一括処理するプログラミングを実行しました。尚、cwebpがインストールされていない場合、インストールする必要があります。さくらレンタルサーバーには入っているみたいです。

cwebp -q 90 元画像名(階層を含む).png -o 変換後のファイル名.webp (変換先の階層を含む)

こうすることで画像は全てwebpに変換することが可能ですが、これだけでは表示が切り替わらないので下記の画像を参照しプラグインの設定を変更してください。

ちなみにこのwebp(ウェッピー)はグーグルさんが開発したものらしいです、大体のブラウザが、こちらの webpに対応しているのですがSafariとIEは非推奨みたいなんですよね。何れwebpに対応すると思います…思いたい。

タグ

, 2.1, cwebp, doc-root, Express, Safari, uploads, webp, webp-express, webp-images, WordPress, wp-content, アップロード, インストール, ウェッピーエクスプレス, お願い, カバー, コマンド, コンバート, サーバー, サイト, さくら, そちら, それ, ため, プラグイン, プログラミング, リスト, レンタル, 一括, 下記, 使用, 処理, 場合, 場所, 変換, 大量, 実行, 対応, 必要, 方法, 現在, 生成, 画像, 確認, 自分, 配下, ,

WEB担当者様各位、サジェスト機能(予測変換)を意識している?

2020.01.24

Logging

サジェスト機能(予測変換)を意識しているブロガーやアファリエターの方は結構多いと思いますが、自分はそれを全然意識はしていませんし、調査して文章を書いていません。本当は意識した方が良いだろうけれど、例えば人工知能でサジェスト機能を使用すると下記のような候補が表示されます。

動画を再生してみてください:サジェスト機能の動画

サジェスト機能で候補が現れる単語(キーワード)の単語を散りばめて記事を書いても上位表示は難しいでしょう。候補が現れるという事は激戦区状態です、そんな内容で記事を書くと殆どはGさんは拾ってくれません。それよりかこれから検索されそうなキーワードを散りばめて記事を書くことをオススメします。

前から自分のブログに書いているように好きな事を書くことのほうが大事です。そして有益な情報をオープンに公開している記事はいづれ検索サーチが進化すると拾ってくれます。三年後には人工知能が記事の意味を理解できるところまで技術は進化すると思っています。

タグ

web, アファ, おすすめ, キーワード, こと, これ, サーチ, サジェスト, それ, たー, ブロガー, ブログ, リエ, , 上位, 下記, 予測, , 人工, 使用, 候補, 公開, 内容, 再生, 動画, 単語, 各位, 変換, 大事, 情報, 意味, 意識, 担当者, 文章, , 有益, 本当, 検索, 機能, 殆ど, 激戦区, 状態, 理解, 知能, 自分, 表示, 記事, 調査, 進化,

テキストを日本語ボイスに変換してくれるしょぼいWindowsソフトを作ったよ。

2020.01.21

Logging

VS2017のC#で、テキストを日本語ボイスに変換してくれるしょぼいWindowsソフト( 滑舌が悪いけどYOUTUBERしたい人用)を作ったよ。自分はかなり滑舌悪いくてどもるので、YOUTUBER向かないのですがユーチューバーしてみたい願望があったので、Gさんの「Cloud Text-to-Speech API」で適当に作ってみた。ちなみにまだYOUTUBERするかは決めてない!

APIですが月に0?100万文字までは無料枠なので、大量に使わない限り無料枠で収まると思います。これを他の人に提供しようとするとアウトだろうけど・・。
自分だけが使用するのには何とかその範囲内かと思います。

尚、ソースコードを提供します可変してお好みで使ってください。大量のテキストをボイス変換した場合、ビジーになるかもしれません。そこら辺の処理は入れてません。またGさんからダウンロードしたJSONファイルを置いている階層に合わしてください。

参考にしたサイトは下記になります。
https://cloud.google.com/text-to-speech/docs/quickstart-client-libraries?hl=ja#client-libraries-install-csharp

フォームのオブジェクトの配置は下記になります。画像を参照ください。

ソースコードは下記になります。

using System;
using System.IO;
using System.Windows.Forms;
using Google.Cloud.TextToSpeech.V1;
namespace テキストを日本語ボイスする
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }
        private void button1_Click(object sender, EventArgs e)
        {
            if(richTextBox1.Text.Replace("\r", "").Replace("\n", "") == "")
            {
                MessageBox.Show("文字を入力してください");
                return;
            }
            Environment.SetEnvironmentVariable("GOOGLE_APPLICATION_CREDENTIALS", "C:\\xxxxx\\xxxxx\\xxxxx\\xxxxx.json", EnvironmentVariableTarget.Process);
            TextToSpeechClient client = TextToSpeechClient.Create();
            SynthesisInput input = new SynthesisInput
            {
                Text = richTextBox1.Text.Replace("\r", "").Replace("\n", "")
            };
            VoiceSelectionParams voice = new VoiceSelectionParams
            {
                LanguageCode = "ja-JP",
                Name = "ja-JP-Wavenet-A",
                SsmlGender = SsmlVoiceGender.Neutral,
            };
            AudioConfig config = new AudioConfig
            {
                AudioEncoding = AudioEncoding.Mp3,
                SpeakingRate = f1(trackBar1.Value),
                Pitch = f2(trackBar2.Value),
            };
            var response = client.SynthesizeSpeech(new SynthesizeSpeechRequest
            {
                Input = input,
                Voice = voice,
                AudioConfig = config
            });
            DateTime dt = DateTime.Now;
            string dttimename = dt.ToString("yyyy-MM-dd-HH-mm-ss");
            using (Stream output = File.Create("voice-" + dttimename + ".mp3"))
            {
                response.AudioContent.WriteTo(output);
                Console.WriteLine($"Audio content written to file 'voice - " + dttimename + ".mp3'");
                MessageBox.Show("生成しました=>>voice - " + dttimename + ".mp3");
                System.Diagnostics.Process.Start(Directory.GetCurrentDirectory());
            }
        }
        private void trackBar1_ValueChanged(object sender, EventArgs e)
        {
            label3.Text = string.Format("{0:0.00}", f1(trackBar1.Value));
        }
        private void trackBar2_ValueChanged(object sender, EventArgs e)
        {
            label4.Text = string.Format("{0:0.00}", f2(trackBar2.Value));
        }
        private double f1(int a) {
            return Convert.ToDouble(a) / 100;
        }
        private double f2(int a)
        {
            return Convert.ToDouble(a) - 20;
        }
    }
}

変換したボイスはこんな感じです!

タグ

0, 100, 2017, API, Cloud, json, Text-to-Speech, VS, Windows, YOUTUBER, アウト, お好み, かなり, コード, これ, ソース, そこら辺, ソフト, ダウンロード, テキスト, ビジー, ファイル, ボイス, ユーチューバー, , , , 使用, 処理, 場合, 変換, 大量, 提供, 日本語, , , 滑舌, 無料, 範囲, 自分, 適当, 限り, 願望,

WEBお問い合わせフォームのお値段はいったい幾ら?

2020.01.17

Logging

WEBお問い合わせフォームのお値段はいったい幾らなのか?
堀江貴文氏はデジタルの値段は限りなくゼロに近くなると言っていたけど、無料のWEB申し込みフォームやお問い合わせフォームはある。自分もお問い合わせフォームの簡易的な物を作ってみましたのでファイルをアップしますね。

テンプレートエンジンとしてtwig3.0を使用しています、そのため動作環境はPHP7.2以上になります。ソースコードの可変は行って構いません、またこのソースコードの動作保証などは致しません。WEB担当者様が確認を行いバグ等があれば修正を行ってください。

尚、Composerでtwigをインストール済みという事が前提となります。また送信部分やエラー処理についてはご自身で機能の追加が必要となります。


サンプルページ
https://zip358.com/tool/request/

<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>お問い合わせ</title>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"
        integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
        integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
        integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
        crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"
        integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"
        crossorigin="anonymous"></script>
    <script src="js/common.js"></script>
    <style>
        .jumbotron {
            background-color: #2bd4d0;
            color: #fff;
        }

        .btn-primary {
            color: #fff;
            background-color: #2bd4d0 !important;
            border-color: #2bd4d0 !important;
        }

        .input-group-text {
            background-color: #2bd4d0;
            border: 1px solid #2bd4d0;
        }
    </style>
</head>

<body>
    <div class="jumbotron jumbotron-fluid">
        <div class="container">
            <h1 class="display-4">お問い合わせ</h1>
            <p class="lead">必須項目を入力し送信ボタンを押してください。<br>DEMOのため送信はできません</p>
        </div>
        <div class="alert alert-warning" id="error_sendmail" role="alert">
        </div>
    </div>
    <form action="index.php" method="POST">
        <div class="container">
            <div class="row">
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text">お名前[必須]</span>
                    </div>
                    <input type="text" name="name" class="form-control" id="name" placeholder="name" value="{{name}}">
                </div>
                <div class="alert alert-warning" id="error_name" role="alert">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text">メールアドレス[必須]</span>
                    </div>
                    <input type="email" name="email" class="form-control" id="email" placeholder="name@example.com"
                        value="{{email}}">
                </div>
                <div class="alert alert-warning" id="error_email" role="alert">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text" id="basic-addon1">@</span>
                    </div>
                    <input type="text" name="twitter_account" class="form-control" placeholder="twitter account"
                        aria-label="twitter account" aria-describedby="basic-addon1" value="{{twitter_account}}">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text">お問い合わせ内容[必須]</span>
                    </div>
                    <select name="meun" class="form-control" id="exampleFormControlSelect1">
                        {% for selectop in meun_option %}
                        <option value="{{selectop.value}}" {{ selectop.value == selectoped ? " selected":"" }}>
                            {{selectop.name}}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="alert alert-warning" id="error_meun" role="alert">
                </div>
                <div class="input-group">
                    <div class="input-group-prepend">
                        <span class="input-group-text">コメント[必須]</span>
                    </div>
                    <textarea name="comment" rows="10" class="form-control" aria-label="コメント">{{comment}}</textarea>
                </div>
            </div>
            <div class="row">
                <footer class="blockquote-footer">
                    <small class="text-muted">
                        ご自由に記入ください。
                    </small>
                </footer>
            </div>
            <div class="alert alert-warning" id="error_comment" role="alert">
            </div>
            <button type="submit" class="mt-2 btn btn-primary btn-lg btn-block">送信する</button>
        </div>
    </form>
</body>

</html>
<?php
session_start();
require __DIR__ . '/vendor/autoload.php';
use Twig\Environment;
use Twig\Loader\FilesystemLoader;

$loader = new FilesystemLoader(__DIR__.'/templates');
$twig = new Environment($loader);
$meun_option = json_decode(file_get_contents("js/select.json"));

$form = ["name","email","twitter_account","meun","comment"];
$data = [];

if($_POST){
	foreach($_POST as $key=>$val){
		$_SESSION[$key] = strip_tags($val);
	}
}
if($_SESSION){
	foreach($_SESSION as $key=>$val){
		$_SESSION[$key] = strip_tags($val);
	}
}

foreach($form as $key => $val){
	$data[$val] = $_SESSION[$val]?$_SESSION[$val]:"";
}

extract($data);

print $twig->render('index.html.twig',["name"=>$name,"email"=>$email,"twitter_account"=>$twitter_account,"selectoped"=>$meun,"comment" => $comment,"meun_option"=>$meun_option]);

タグ

3.0, 358, 7.2, com, Composer, DOCTYPE, gt, html, https, lt, php, request, tool, Twig, web, www, zip, アップ, インストール, エラー, エンジン, お問い合わせ, コード, ご自身, サンプル, ゼロ, ソース, ため, デジタル, テンプレート, バグ, ファイル, フォーム, ページ, , 使用, 保証, 修正, 値段, 処理, 前提, 動作, 堀江貴文, 幾ら, 必要, 担当者, 機能, 無料, , 環境, 確認, 簡易的, 自分, 追加, 送信, 部分,

お金を燃やすとどうなるか?

2020.01.13

Logging

日本の場合、他人のお金を燃やすとそれは罪になります。
これは当たり前なので、まぁそうだろうという考えなのですが、
自分のお金を燃やすとどうなるかというと、答えは違うんですね。

自分の紙幣を故意に燃やすことは罪になりませんが、硬貨を燃やす(溶かす)と
これは罪になります。燃やす以外にも硬貨を曲げたり加工したりすることは
違法です。YOUTUBEで硬貨を曲げたりする行為をアップすると罪に
なりますのでくれぐれもUPしないように、これは日本の法律ではそうなっているので他の国は違うかもしれません。

日本の憲法はかなり古い物が多いです、それを今でも殆ど法律は改正しないで
使用されています。だからトンチンカンな法律は結構ありそれを
悪用する人もいるでしょう。

ちなみにテクノロジーが進んでいるので、自分はそれに対応する法律の
改正などは行ったほうが良いと思いますし、何年間に一回は
見直しを行うことは大事だと考えています。

日本の場合、一度決まると見直しがなかなかされないのが
変だと思います。世の中変わっていっているからそれに合わさないと
やはり時代遅れの法律になってしまう気がします。

タグ

UP, youtube, アップ, お金, かなり, くれぐれ, こと, これ, それ, テクノロジー, , , , , 他人, 以外, 何年間, 使用, 加工, , 場合, 大事, 対応, 当たり前, 悪用, 憲法, 改正, 故意, 日本, 殆ど, 法律, , 硬貨, 答え, 紙幣, , 自分, 行為, 違法,

俳優がCG化される時代に突入。

2020.01.11

Logging

あと10年後には誰かがデジタル俳優だけで映画を作ることをするだろうと。
誰かが始めると次々とデジタル俳優で映画を作る映画監督が
増えていくと思います。

ネットフリックスの下記の動画を観てください、CG(コンピューターグラフィックス)だけで精巧にデジタル俳優を造形することが
もう出来てしまっています。

あともう少しで本物かCG画像(VFX)か見分けがつかないように
なると思います。10年後と言いましたが、最高で10年で
最短ではあと数年で見分けがつかないようになると思っています。

繰り返しになりますが、そうなった時に必ずこの技術を使用して、
俳優に演技をさせず、デジタル俳優(仮想俳優)だけで作ると思います。

尚、このネットフリックスのオリジナル映画予告も載せときますね。

How The Irishman’s Groundbreaking VFX Took Anti-Aging To the Next Level | Netflix

アイリッシュマン予告動画↓

『アイリッシュマン』最終予告編

タグ

0, 10, 461, be, Cg, OF-lElIlZM, VFX, youtu, アイリッシュ, あと, オリジナル, グラフィックス, こと, コンピューター, デジタル, ネットフリックス, マン, 下記, 予告, 仮想, 使用, 俳優, 動画, 技術, , 映画, , 時代, 最短, 最高, 本物, 演技, 画像, 監督, 突入, 精巧, 誰か, 造形,

WordPressのメディアライブラリについて愚痴る。

2020.01.08

Logging

過去のデータベースを引き継いでいればメディアライブラリのデータは
壊れないが、途中でXMLなどデータをインポートすると
メディアライブラリでは管理出来なくなってしまう。

これを呼び戻すには Add From Server やmedia from ftpなどのプラグインを
使用して呼び戻すしか無いようだと思っていたが、唯これをしてしまうと
いささか問題があるので使えない。
このプラグインは基本的に新規で構築する際に
画像をFTPで一先ず一括アップロードして使用する場合などに対しての
プラグインである物なのでいささか違う。

なので今回、自分で自作しようと思っていたが、、、
特に過去の画像を編集するつもりもないので辞めた。
ちなみにメディアライブラリの画像はwp_postsとwp_postmetaに
保存されている。

下記のURLを見て昔、これでトラブルになった事を思い出した。
WordPressで画像はどのようにデータベースに記録されているか

上記のようなことから、データベースの画像の欠損を復元するのは
正直なところ面倒。投稿データには大体、データは残っているのだが
メタデータが欠損していてメディアライブラリに表示されないということが
殆どだと思うが、このメタデータを復元するのは至難、なぜなら
投稿データって使っているIDとメタデータのIDのリンクを上手く結びつける
事ができないからとてもエンジニア泣かせである。

要するにメタデータIDの方が以前使っていたIDを別の要素のIDが
使っていたりして…。
これを整理しながら元に戻すのは非常に至難だと言うこと。

なので、結論を言えばちゃんとデータベースのバックアップ取りましょう?

タグ

Add, from, FTP, media', postmeta, posts, SERVER, url, WordPress, wp, xml, アップロード, インポート, これ, つもり, データ, データベース, トラブル, プラグイン, メディア, ライブラリ, 一括, 下記, , 今回, 使用, 保存, 問題, 場合, 新規, , 構築, , 画像, 管理, 編集, 自作, 自分, 記録, 途中, 過去, ,

今年最後のブログ…

2019.12.31

Logging

今年もユーザーさんに支えられブログを続けることが出来ました。

過去のブログを他のブログに移行していたのですが、
12月にそのブログももとに戻し、更新頻度も前と同じに変更しました。
(※そのブログも来年から不定期で更新していきます)

毎年の恒例の未来予想の話を記載します、
来年(2020年)、何が起こるかといえば自分は
人工知能のサービスが日本でも大々的に
各企業(中小企業含む)が使用されるようになると思います。

また、スマートグラスというものがもしかしたら
来年浸透するかもしれないなと思っています。

これはスマホに続く便利ツールになると感じています。

Amazon-Backed Smart Glasses For $1,000: First Look

あと日本でも5G(ファイブジー)のサービスが開始されますよね。
これは新しい風になると思います、通信費がいまの4G程だと
浸透するのはかなり早いと思います、また来年から
ギガ通信の制限がなくなるそうなので、
いろいろな事が変わり始める年になると思います。

※今年最後のブログ記事を見て頂きありがとうございます。
良いお年を!!

タグ

2020, 4, 5, いま, いろいろ, かなり, ギガ, クラス, こと, これ, サービス, シー, スマート, スマホ, ツール, ファイブ, ブログ, もと, もの, ユーザー, 不定期, 中小企業, 予想, , 人工, 今年, , 企業, , 使用, 便利, 制限, , 変更, , 恒例, 日本, 更新, 最後, 未来, 来年, 毎年, 浸透, 知能, 移行, , 自分, 記事, 記載, , 通信, 過去, 開始, 頻度, ,

ワードプレス電光掲示板プラグインを作りました。

2019.12.05

Logging

電光掲示板(お知らせ)のプラグイン取扱に関して記載します。

プラグインに関してはワードプレス5.2以降を推奨としテーマファイル(外観)のheader.phpのbody直下に下記の記述が存在しない場合は追加記述を
お願いいたします。

<?php wp_body_open();?>

尚、プラグインのソースコードはご自由に変更頂き二次配布も構いませんが
ひとつ注意事項があります。参照した記事にリンクを貼ってください、
なお、事前の連絡等入りません。

電光掲示板(お知らせ)のソースコードは下記になります。
現在、テキストはHTMLタグを許していますので、いろいろと自由に
変更することが可能かと思います。

ちなみにこういった電光掲示板みたいな流れる仕様のコードは
インターネットの初期のころは多く見られましたが
このごろは全然、見なくなりましたね。。。

CSSの記述に関してはとくめいさんの記述を使用させて頂きました。
https://creatorclip.info/2014/06/css3-electric-bulletin-board/

とくめいさんも同じようなことを記事に記載しておりますが
自分もそのように感じました。

とくめいさんへ断りもなく使用してすみません、
Twitterで連絡しようかなと思ったのですが、それもなんだかと思い
勝手ながらこのような手段を取りました。

お知らせ(電光掲示板)のダウンロードは下記になります。
下記のファイルを解凍しワードプレスのプラグイン領域にフォルダごと
アップロードしプラグインを有効にするとご使用頂けます。

https://zip358.com/plugin/Z-Electric-bulletin-board.zip

<?php
/*
Plugin Name: Z-Electric-bulletin-board
Plugin URI: https://zip358.com/plugin/Z-Electric-bulletin-board.zip
Description: お知らせ
Author: taoka toshiaki
Version: 1.0
Author URI: https://zip358.com/
*/
add_action( 'wp_head', function() {
    $color = get_option('ZEBB_color')?get_option('ZEBB_color'):"ffffff";
    $cssdata ="
    <style>
        /* =====================
            電光掲示板
        ======================= */
        .ledText {
            overflow: hidden;
            position: relative;
            padding:5px 0;
            color: #$color;
            font-size: 60px;
            font-weight: bold;
            background: #333333;
        }
        /* CSS3グラデーションでドット感を出す */
        .ledText:after {
            content: ' ';
            display: block;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background-image: linear-gradient(#0a0600 1px, transparent 0px), linear-gradient(0, #0a0600 1px, transparent 1px);
            background-image: -webkit-linear-gradient(#0a0600 1px, transparent 0px), -webkit-linear-gradient(0, #0a0600 1px, transparent 1px);
            background-size: 2px 2px;
            z-index: 10;
        }
        /* CSS3アニメーションでスクロール */
        .ledText span {
            display: inline-block;
            white-space: nowrap;
            padding-left: 100%;
            -webkit-animation-name: marquee;
            -webkit-animation-timing-function: linear;
            -webkit-animation-iteration-count: infinite;
            -webkit-animation-duration: 15s;
            -moz-animation-name: marquee;
            -moz-animation-timing-function: linear;
            -moz-animation-iteration-count: infinite;
            -moz-animation-duration: 15s;
            animation-name: marquee;
            animation-timing-function: linear;
            animation-iteration-count: infinite;
            animation-duration: 15s;
        }
        @-webkit-keyframes marquee {
        from   { -webkit-transform: translate(0%);}
        99%,to { -webkit-transform: translate(-100%);}
        }
        @-moz-keyframes marquee {
        from   { -moz-transform: translate(0%);}
        99%,to { -moz-transform: translate(-100%);}
        }
        @keyframes marquee {
        from   { transform: translate(0%);}
        99%,to { transform: translate(-100%);}
        }
    </style>
    ";
    print $cssdata;
 });
add_action("wp_body_open",function(){
    $text = get_option('ZEBB_text')?get_option('ZEBB_text'):"";
    if($text)print '<p class="ledText"><span>'.$text.'</span></p>';
});
add_action('admin_menu','Z_Electric_bulletin_board_set');
function Z_Electric_bulletin_board_set(){
	add_options_page(
		'zip358.com:プラグイン',
		'電光掲示板設定',
		'administrator',
		'Z_Electric_bulletin_board',
		function(){
            if(isset($_POST["ZEBB_color"]) or isset($_POST["ZEBB_text"])){
                $color = preg_match("/[a-zA-Z0-9]*/",$_POST["ZEBB_color"])?$_POST["ZEBB_color"]:"ffffff";
                update_option('ZEBB_color', wp_unslash($color));
                $text = $_POST["ZEBB_text"];
                update_option('ZEBB_text', wp_unslash($text));
            }
            ?>
            <form method="post" action="">
                <h2>電光掲示板設定</h2>
                color code #<input type="text" style="width:350px" name="ZEBB_color" value="<?=get_option('ZEBB_color')?get_option('ZEBB_color'):""?>" placeholder="f7f7f7"><br>
                text <input type="text" style="width:350px" name="ZEBB_text" value="<?=get_option('ZEBB_text')?get_option('ZEBB_text'):""?>" placeholder="文字を記入してください"><br>
                テキスト文字を未入力にすると電光掲示板が表示されません
                <?php submit_button(); ?>
            </form>
            <?php
        }
	);
}

タグ

5.2, body, css, gt, header, html, lt, open, php, wp, いろいろ, インターネット, お知らせ, お願い, コード, こと, ごろ, ころ, ソース, タグ, テーマ, テキスト, トク, ひとつ, ファイル, プラグイン, プレス, メイ, リンク, ワード, 下記, 事前, 事項, , 仕様, 使用, 初期, 参照, 取扱, 可能, 場合, 変更, 外観, 存在, 推奨, 掲示, 注意, 現在, 直下, 自由, 記事, 記載, 記述, 追加, 連絡, 配布, 電光,

WordPressの404外部リダイレクトプラグインを作りました。

2019.11.16

Logging

WordPressの404外部リダイレクトプラグインを作りました。
ソースコードはこんな感じになってます、、、。
使用される方は下記のURLよりダウンロードを行ってください。
解凍してフォルダをワードプレスのpluginを置く場所へアップロードし
page404goプラグインを有効にしていただければ使用できます。
https://zip358.com/plugin/page404go.zip

<?php
/*
Plugin Name: page404GO!!
Plugin URI: https://zip358.com/plugin/page404go.zip
Description: 404ページを任意のURLへ変換し遷移させる
Author: taoka toshiaki
Version: 1.0
Author URI: https://zip358.com/
*/
add_action( 'wp', function() {
    global $wp;
    $domain = get_option('domain404page')?get_option('domain404page'):"https://zip358.com/";
    if(is_404()){
        wp_redirect($domain.$wp->request);
        exit;
    }
 });
add_action('admin_menu','page404go_setting');
function page404go_setting(){
	add_options_page(
		'zip358.com:プラグイン',
		'404リダイレクト設定',
		'administrator',
		'page404go',
		function(){
            if(isset($_POST["domain404page"])){
                if(preg_match("/https?://.*/$/",$_POST["domain404page"])){
                    $url = $_POST["domain404page"];
                }elseif(preg_match("/https?://.*/",$_POST["domain404page"])){
                    $url = $_POST["domain404page"]."/";
                }else{
                    $url = "https://zip358.com/";
                }
                update_option('domain404page', wp_unslash($url));
            }
            ?>
            <form method="post" action="">
                <h2>リダイレクトドメイン指定</h2>
                <input type="text" style="width:350px" name="domain404page" value="<?=get_option('domain404page')?get_option('domain404page'):""?>" placeholder="https://zip358.com/">
                <?php submit_button(); ?>
            </form>
            <?php
        }
	);
}

タグ

1195254834632380416, 358, 404, Author, com, description, go, lt, name, page, php, plugin, status, taoka, toshiak, Twitter, URI, url, WordPress, zip, アップロード, コード, ソース, ダウンロード, フォルダ, プラグイン, プレス, リダイレクト, ワード, 下記, 任意, 使用, 場所, 変換, 外部, 感じ, , 有効, 解凍, 遷移,

スマホ決済の今後。

2019.11.14

Logging

スマホ決済の今後、都市ではSuicaだけあれば
ほとんどの店舗で使用できるようになり、地方ではPaypayだけで
十分使用できるようになるかと思います。

ちなみにYahooとLINEが経営統合すれば間違いなく、そうなりそうな
気がします。高知県ではスーパーは楽天と提携している店舗が多いです。
スーパー以外はPaypayとLINE Pay決済のアプリを入れていれば
60%の確率で決済可能です。

現金オンリーというお店はありますが…。
徐々に増えていくと思います。

銀行ペイなどもありますが、今後ソフトバンクが地方銀行を
提携していくか買い取っていくと思います。

タグ

60, line, Pay, Paypay, Suica, Yahoo, アプリ, オンリー, お店, スーパー, スマホ, ソフトバンク, ペイ, ほとんど, 今後, 使用, , 可能, 地方, 店舗, 提携, 楽天, , 決済, 現金, 確率, 経営, 統合, 都市, 銀行, 高知県,

Linuxでプロセス残すなら!

2019.11.08

Logging

Linuxでプロセス残すなら【nohup コマンド &】を使おう。
以前、仮想ウィンドウを開いて行う方法を記載しましたが
こちらのほうが断然らくです。

ちなみにこれを使用すると、 nohup.out というファイルが作成されます。
node.jsやPythonとかで使用する機会が多いかもしれません。

例えばこんな感じで

nohup Python index.py &

過去記事:プロセス残してSSHログアウトする方法。

タグ

amp, index, JS, Linux, node, nohup, out, py, Python, SSH, ウィンドウ, こちら, コマンド, これ, ファイル, プロセス, ログアウト, 以前, 仮想, 作成, 使用, 感じ, 方法, 機会, 記事, 記載, 過去,

オレオレ無名関数の再帰処理。

2019.10.26

Logging

無名関数はよく使います。ちょっとしたモノを書きたい時、
オレオレ無名関数を書いて済ますことが多くなりました。
無名関数の良いところは無名関数を使用する手間にメソッドがあるので
確認しやすいというところですね。
 

<?php
$mumei = function ($tasu=0) use(&$mumei){
    if($tasu<=150){
        $tasu = $tasu + 5;
        print $tasu."n";
        return $mumei($tasu);
    }
    return $tasu;
};
//オレオレ無名関数の使い方は…小道具ぐらい程度のもの。
print $mumei();
// 5
// 10
// 15
// 20
// 25
// 30
// 35
// 40
// 45
// 50
// 55

タグ

0, 10, 15, 150, 20, 25, 30, 35, 40, 45, 5, amp, function, if, lt, mumei, nbsp, php, print, return, tasu, use, オレオレ, こと, ところ, メソッド, もの, 使い方, 使用, 再帰, 処理, 小道具, 手間, , , 無名, 確認, 程度, 関数,

内容まで¥r¥nで書かれたCSVコードを整形する簡単な方法。

2019.10.19

Logging

内容まで¥r¥nで書かれたCSVコードを整形する簡単な方法。
CSVの内容まで¥r¥nで書かれているとプログラム(PHP)で読み込みが
とても面倒くさいなので、自分は手っ取り早い方法で整形を行いました。
まずCSV編集専用のソフトか何かでファイルを開いてください。
おそらく正しく読み込まれると思います。次に
列の最後に新たに列を追加しCSVで使用されていないユニークな文字を
記入して行端まで値を入れて再度保存してください。
次にエディターでCSVを開き、全ての¥r¥nを¥nに置き換えます。
次に列の最後につけた、ユニークな文字を¥r¥nに置き換えます。
こうすることにより列の終端を探すなどのコード書かなくても
explodeなどで取り出すことが可能です。
但し容量が多いG(ギガ)単位のCSVファイルには通用しません。
その場合、CSVファイルを分離するか、
プログラムで何とかするかになります。

以上、小技テクニックでした。
 

タグ

CSV, explode, php, エディター, ギガ, コード, こと, ソフト, ファイル, プログラム, ユニーク, 但し, 何か, 使用, 保存, , 全て, 内容, 再度, 分離, , 単位, 可能, 場合, 容量, 専用, 整形, 文字, 方法, 最後, 簡単, 終端, 編集, 自分, 行端, 記入, 追加, 通用,

自分の務めてる会社の1次入社試験(過去問)

2019.10.12

Logging

自分の務めてる会社の入社試験(過去問)です。
これぐらいのことは出来てもらわないと困るという事で出題したのですが
どうもこの問題難しいのか?
ここまで漕ぎ着けて採用された人はひとりしかいない。
大手の会社にはこんなの簡単だよという人は
たくさんいると思いますが、自分の務めてる会社は
どちらかと言えば零細企業です。
こういう問題出しても中々、解けない人が多くて
採用まで至らないのが現状です。
※今は募集していません。
■問題
郵便番号入力すると検索結果を表示するようにせよ。
また下記の条件を満たしていることとする。
1.サジェスト機能がある。
2.PHP言語を使用。
3.非同期処理。
単なるこれだけでも、中々出来る人が来ない。
これが零細企業地方の現状です。
https://zip358.com/tool/postal_code_search/

タグ

, 2, , 358, Code, com, php, postal, search, tool, zip, ここ, こと, これ, これぐらい, これだけ, サジェスト, たくさん, どちらか, ひとり, また下, 中々, , , , 企業, 会社, 使用, 入力, 入社, 処理, 出題, 募集, 同期, 問題, 地方, 大手, 採用, 条件, 検索, 機能, 現状, 番号, 簡単, 結果, 自分, 表示, 言語, , 試験, 過去問, 郵便, 零細,

ちょっとした物。InstagramのAPI取得する

2019.10.05

Logging

Instagram(インスタグラム)の画像などが取得することが出来ます。アクセストークンの取得の方法がわからない場合はぐぐってください。尚、APIのバージョンが、今後上がった場合は下記のコードは使用できなくなる可能性があります。ちなみにこのコード動作確認はしておりません。このコードを理解して使用できる人のみお使いください。
尚、画像取得数はデフォルト10にしています。プログラムではアクセストークンと20を渡しています。
画像URLはコメントアウトのところに入ってきます。※プログラムを可変してお使いください。

<?php
//Instagram
//https://api.instagram.com/v1/users/self/media/recent/?access_token=&count=
class instagram_api{
    public const url ="https://api.instagram.com/v1/users/self/media/recent/?access_token=";
    public function api ($access_token= "",$img_count =10){
        $url = self::url;
        return (object)json_decode(@file_get_contents($url . $access_token."&count=".$img_count));
    }
    public function obj_img($obj=Null){
        if(!is_object($obj))return false;
        if(!$obj->data)return false;
        foreach ($obj->data as $key => $item) {
            var_dump($item);
            // $item->images->standard_resolution->url
            // $item->images->low_resolution->url
        }
        return true;
    }
}
$obj = instagram_api::api("access_token",20);
instagram_api::obj_img($obj);

タグ

, 10, 20, access, API, class, com, const, count, https, instagr, Instagram, lt, media', php, public, quot, recent, self, token, url, users, アウト, アクセス, インスタグラム, コード, こと, コメント, デフォルト, トークン, ところ, バージョン, プログラム, 下記, , 今後, 使用, 動作, 取得, 可能性, 場合, 方法, , 理解, 画像, 確認,

高知県のダム貯水率をグラフ化してみた。

2019.09.21

Logging

高知県のダム貯水率をグラフ化してみた。
親戚にダムに勤めている人がいるのがきっかけで貯水率って
HPで表示させているのかなという事で調べてみました。
結果、かなり古いデザインサイトが現れた。
何とも懐かしい気持ちになりました。
そこでこの表からグラフ化してみたいなとか思って
ゴニョゴニョ作ってみた。
ちなみにソースコードが変わると
抜き取り出来なくなります。
追記:やはり変更されていました2へ続く
ソースコードを貼っときます。
ajaxとPHPを使用してます、XPathで貯水率だけ抜き取ってます。
サンプルサイト
https://zip358.com/tool/demo6/index.html

<?php
$html = file_get_contents("高知県のダム情報のURL");
$html = mb_convert_encoding($html,"UTF-8","SJIS");
$dom = new DOMDocument();
$html = mb_convert_encoding($html, "HTML-ENTITIES", 'UTF-8');
@$dom->loadHTML($html,LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);
$xpath = new DOMXPath($dom);
$ary=array(
    "nagase",
    "kamaidani",
    "kagami",
    "sameura",
    "kirimi",
    "sakamoto",
    "oodo",
    "nakasugawa",
    "iburigawa"
);
for($i=3;$i<=11;$i++){
    foreach ($xpath->query("/html/body/form/div[2]/table/tr/td/table/tr[$i]/td[7]") as $node) {
        $r[] = preg_replace("/x{00a0}/u","",$node->textContent);
    }
}
foreach ($r as $key => $value) {
    $obj[$ary[$key]] = $value;
}
print json_encode($obj);
$(function(){
    dam();
    //setInterval(dam,9999)
});
function dam(){
    $.ajax({
        url : './dam.php',
        dataType : 'json',
        success : function(obj){
            $("#nagase").attr( "style","width:"+ parseInt(obj.nagase) +"%");
            $("#kamaidani").attr( "style","width:"+ parseInt(obj.kamaidani) +"%");
            $("#kagami").attr( "style","width:"+ parseInt(obj.kagami) +"%");
            $("#sameura").attr( "style","width:"+ parseInt(obj.sameura) +"%");
            $("#kirimi").attr( "style","width:"+ parseInt(obj.kirimi) +"%");
            $("#sakamoto").attr( "style","width:"+ parseInt(obj.sakamoto) +"%");
            $("#oodo").attr( "style","width:"+ parseInt(obj.oodo) +"%");
            $("#nakasugawa").attr( "style","width:"+ parseInt(obj.nakasugawa) +"%");
            $("#iburigawa").attr( "style","width:"+ parseInt(obj.iburigawa) +"%");
            $("#nagase").attr( "aria-valuenow",parseInt(obj.nagase));
            $("#kamaidani").attr( "aria-valuenow",parseInt(obj.kamaidani));
            $("#kagami").attr( "aria-valuenow",parseInt(obj.kagami));
            $("#sameura").attr( "aria-valuenow",parseInt(obj.sameura));
            $("#kirimi").attr( "aria-valuenow",parseInt(obj.kirimi));
            $("#sakamoto").attr( "aria-valuenow",parseInt(obj.sakamoto));
            $("#oodo").attr( "aria-valuenow",parseInt(obj.oodo));
            $("#nakasugawa").attr( "aria-valuenow",parseInt(obj.nakasugawa));
            $("#iburigawa").attr( "aria-valuenow",parseInt(obj.iburigawa));
            $("#nagase").text(obj.nagase + "%");
            $("#kamaidani").text(obj.kamaidani + "%");
            $("#kagami").text(obj.kagami + "%");
            $("#sameura").text(obj.sameura + "%");
            $("#kirimi").text(obj.kirimi + "%");
            $("#sakamoto").text(obj.sakamoto + "%");
            $("#oodo").text(obj.oodo + "%");
            $("#nakasugawa").text(obj.nakasugawa + "%");
            $("#iburigawa").text(obj.iburigawa + "%");
        },
        error: function(obj){
            alert("error");
        }
    });
  }
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>高知県のダム貯水率</title>
    <script src="../jquery/jquery-3.4.1.js"></script>
    <link rel="stylesheet" href="../bootstrap/css/bootstrap.css">
    <script src="./js/dam.js"></script>
    <style>
        body{
            background-color: #3e4654;
            color: aliceblue;
        }
    </style>
</head>
<body class="d-flex flex-column h-100">
    <main role="main" class="flex-shrink-0">
        <div class="container">
            <table class="table table-dark">
                <tr>
                    <td style="width:15%">
                        <p>永瀬ダム</p>
                    </td>
                    <td style="width:85%">
                        <div class="progress"  style="width:100%">
                            <div id="nagase" class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="20"
                                aria-valuemin="0" aria-valuemax="100" style="width:20%"></div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width:15%">
                        <p>鎌井谷ダム</p>
                    </td>
                    <td style="width:85%">
                        <div class="progress">
                            <div id="kamaidani" class="progress-bar progress-bar-striped progress-bar-animated bg-warning" role="progressbar" aria-valuenow="20"
                                aria-valuemin="0" aria-valuemax="100" style="width:20%"></div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width:15%">
                        <p>鏡ダム</p>
                    </td>
                    <td style="width:85%">
                        <div class="progress">
                            <div id="kagami" class="progress-bar progress-bar-striped progress-bar-animated bg-info" role="progressbar" aria-valuenow="20"
                                aria-valuemin="0" aria-valuemax="100" style="width:20%"></div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width:15%">
                        <p>早明浦ダム</p>
                    </td>
                    <td style="width:85%">
                        <div class="progress">
                            <div id="sameura" class="progress-bar progress-bar-striped progress-bar-animated bg-secondary" role="progressbar" aria-valuenow="20"
                                aria-valuemin="0" aria-valuemax="100" style="width:20%"></div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width:15%">
                        <p>桐見ダム</p>
                    </td>
                    <td style="width:85%">
                        <div class="progress">
                            <div id="kirimi" class="progress-bar progress-bar-striped progress-bar-animated bg-success" role="progressbar" aria-valuenow="20"
                                aria-valuemin="0" aria-valuemax="100" style="width:20%"></div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width:15%">
                        <p>坂本ダム</p>
                    </td>
                    <td style="width:85%">
                        <div class="progress">
                            <div id="sakamoto" class="progress-bar progress-bar-striped progress-bar-animated bg-warning" role="progressbar" aria-valuenow="20"
                                aria-valuemin="0" aria-valuemax="100" style="width:20%"></div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width:15%">
                        <p>大渡ダム</p>
                    </td>
                    <td style="width:85%">
                        <div class="progress">
                            <div id="oodo" class="progress-bar progress-bar-striped progress-bar-animated bg-danger" role="progressbar" aria-valuenow="20"
                                aria-valuemin="0" aria-valuemax="100" style="width:20%"></div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width:15%">
                        <p>中筋川ダム</p>
                    </td>
                    <td style="width:85%">
                        <div class="progress">
                            <div id="nakasugawa" class="progress-bar progress-bar-striped progress-bar-animated bg-dark" role="progressbar" aria-valuenow="20"
                                aria-valuemin="0" aria-valuemax="100" style="width:20%"></div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width:15%">
                        <p>以布利川ダム</p>
                    </td>
                    <td style="width:85%">
                        <div class="progress">
                            <div id="iburigawa" class="progress-bar progress-bar-striped progress-bar-animated bg-warning" role="progressbar" aria-valuenow="20"
                                aria-valuemin="0" aria-valuemax="100" style="width:20%"></div>
                        </div>
                    </td>
                </tr>
            </table>
        </div>
    </main>
    <footer class="footer mt-auto py-3">
        <div class="container">
            <span class="text-muted">©zip358.com</span>
        </div>
    </footer>
</body>
</html>

タグ

2, 358, 6, 8, ajax, com, contents, convert, demo, encoding, file, GET, HP, html, https, index, lt, mb, php, SJIS, tool, url, UTF-, XPath, zip, かなり, きっかけ, グラフ, コード, ゴニョゴニョ, サイト, サンプル, ソース, そこ, ダム, デザイン, , , , 使用, 変更, 情報, 気持ち, 結果, , 表示, 親戚, 貯水, 追記, 高知県,

変なコードを書いてしまった。それはいつものこと(笑)

2019.08.10

Logging

変なコードを書いてしまった。
PHPにstr_repeatという関数が存在しているのだけど
何のために使用するのか全然わからない。関数の内容は任意の文字を
指定回数、繰り返した文字列として返してくれるというものです。
試しにその関数を使用し変なコードを書きました。
茶目っ気ですので…。これがPCに負担がかかるとか
無限ループとかの処理にすると御縄なんでしょうけど・・・。
サンプルコードはこちらから
https://zip358.com/tool/demo5/index-11.php

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script src="../jquery.tubular.1.0.1/js/jquery.tubular.1.0.js"></script>
        <link rel="stylesheet" type="text/css" href="../jquery.tubular.1.0.1/css/screen.css">
        <script>
            $('document').ready(function() {
            var options = {
                videoId: '760lRwLKFF0',
                mute: true,
            };
            $('#bgmovie').tubular(options);
            });
        </script>
        <style>
            body{
                background-color: #000;
                color: #fff;
                font-size: 80px;
                line-height: 80px;
            }
            p{
                color: #38a9c5;
            }
        </style>
    </head>
    <body>
    <div id="bgmovie">
        <!--[if lt IE 7]>
            <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="#">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->
<?php
$str = str_repeat("高知 よさこい 踊る,",7);
var_dump(str_getcsv($str));
?>
<p class="oshite" data-oshite="<?=$str?>"style="text-decoration: underline">▼おして知るべし</p>
※おして知るべしをクリックすると7ウィンドウ開きますよ!!
<?php
    foreach(str_getcsv($str) as $val){
?>
<?php
    }
?>
</div>
        <script>
            $(function(){
                $(".oshite").on("click",function(){
                    let oshite = $(this).attr("data-oshite").split(",");
                    for(var i = 0 ; i < oshite.length ; i++){
                        if(oshite[i]!==""){
                            window.open("https://twitter.com/search?src=typed_query&q=" + encodeURIComponent(oshite[i]));
                        }
                    }
                });
            });
        </script>
        <script src='https://vjs.zencdn.net/7.6.0/video.js'></script>
    </body>
</html>

タグ

--, 11, 358, 5, 7, 8, , class, com, demo, DOCTYPE, endif, gt, html, IE, if, index, lt, lt-ie, no-js, PC, php, repeat, STR, tool, zip, いつも, コード, こちら, こと, これ, サンプル, それ, ため, もの, ループ, 任意, , 使用, 内容, 処理, 回数, , 存在, 指定, 文字, 文字列, 無限, , 茶目っ気, 負担, 関数,

TinyMCE 5.0でwindowManager.openUrl使用してコードの送受信。

2019.08.03

Logging

TinyMCE 5.0の記事が好評だったので前回に続き、windowManager.openUrl使用してコードの送受信の内容を記載します。あくまでもサンプルコードです。プログラムなので他にもやり方はあると思います。前回の記事に勘どころは記載していますので割愛します。尚、自分は英語がダメダメですが幸いコードを読む力はある程度あるので何とかなりました。サンプルコードを記載しますので解析してみてください。

PHP&HTMLコード

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="/tool/bootstrap/css/bootstrap.css">
        <script src="/tool/jquery/jquery-3.4.1.js"></script>
    </head>
    <body>
        <form method="post">
        <textarea name="htmlcode1" class="form-control">
<?php
    echo urldecode($_GET["sdata"]);
?>
        </textarea>
        <input type="button" name="submitbtn" value="htmlcode-submit"class="btn btn-primary">
        </form>
        <script>
            var chageJson = function(data) {
            console.log(data);
            var JsonData = [];
            for (i = 0; i < data.length; i++) {
                if(/htmlcode/.test(data[i].name)){
                    data[i].value = encodeURIComponent(data[i].value);
                }
                JsonData[data[i].name] = data[i].value
            }
            //console.log(JSON.stringify(data));
            return JsonData;
            }
            $("[name=submitbtn]").on("click",function(){
                data = chageJson($("form").serializeArray());
                window.parent.postMessage({ mceAction: 'customAction',data:data});
                window.parent.postMessage({ mceAction: 'close' });
            });
        </script>
    </body>
</html>

jsコード

(function() {
    tinymce.create('tinymce.plugins.btxt', {
        init : function( ed,  url) {
            //console.log(ed);
            act = function(e)
            {
                    //console.log("e=",encodeURIComponent(e.selection.editor.getContent()));
                ed.windowManager.openUrl(
                    {
                    type: 'panel',
                    title: 'HTMLCODE',
                    url:url + "/btxt.php?sdata=" + encodeURIComponent(e.selection.editor.getContent()) ,
                    onMessage:function(api, details){
                      console.log(e);
                      //console.log('htmlcode1',decodeURIComponent(details.data.htmlcode1));
//                      var editorInstance = tinymce.editors[0];
                      e.selection.editor.setContent(decodeURIComponent(details.data.htmlcode1));
                   }
                }
                );
            };
              ed.ui.registry.addButton('btxt',{
                title : 'htmlcode',
                text: 'htmlcode',
                onAction:function(){act(ed)}
            });
        },
    getInfo : function() {
        return {
            longname : 'tinymce.plugins.btxt',
            author : 'taoka',
            authorurl : 'https://zip358.com',
            infourl : 'https://zip358.com',
            version : '1.0'
        };
    }
});
        tinymce.PluginManager.add('btxt', tinymce.plugins.btxt);
})();

タグ

--, 5.0, 7, 8, , class, DOCTYPE, endif, gt, html, IE, if, lt, lt-ie, no-js, openUrl, php, quot, TinyMCE, windowManager, コード, サンプル, ダメダメ, プログラム, やり方, , 使用, 内容, 前回, 割愛, , 勘どころ, 好評, 自分, 英語, 解析, 記事, 記載, 送受信,

TinyMCE 5.0でオリジナルプラグイン作成するはググれば何とかなるが?

2019.07.27

Logging

TinyMCE 5.0で独自のプラグインを開発するにあたって
ググれば4.0で作成する方法は山ほど例題があるのだけど5.0は
非常に少ないtinymce.windowManager.openを使用してのプラグインは
5.0でも案外簡単に見つかるのだけど、tinymce.windowManager.openUrlを
使用しての情報はググってもない。
唯一、公式サイトが記載しています。
しかし残念なことに全て英語で書かれています。

日本語で記載しろよという話だけど・・・・。
で!!tinymce.windowManager.openUrlで
何が出来るかと言えば外部ファイルを
読み込みが出来てそのレスポンスを受け取る事が出来るのです。
英語が嫌いでも原文で英語を読め!!ですよ・・・。
答えはそのページに書いているのですね。
※ちなみに会社でこの機能(e.windowManager.openUrl)を
使用し開発中です。
たぶん、自分みたいに困っている人もいると思うので
基本的な部分を記載しています、なお自作プラグインの作り方は
理解しているという前提で記載しています。
まず例としてPHPファイルを読み込みたいのなら
自作プラグインのPHPファイルに下記の記載を行います。

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="/tool/bootstrap/css/bootstrap.css">
        <script src="/tool/jquery/jquery-3.4.1.js"></script>
    </head>
    <body>
        <form method="post">
        <input type="text" name="L_japan" class="form-control">
        <input type="text" name="L_English" class="form-control">
        <input type="button" name="submitbtn" value="恩恵を受ける"class="btn btn-primary">
        </form>
        <script>
            var chageJson = function(data) {
            console.log(data);
            var JsonData = [];
            for (i = 0; i < data.length; i++) {
                JsonData[data[i].name] = data[i].value
            }
            //console.log(JSON.stringify(data));
            return JsonData;
            }
            $("[name=submitbtn]").on("click",function(){
                data = chageJson($("form").serializeArray());
                window.parent.postMessage({ mceAction: 'customAction',data:data});
                window.parent.postMessage({ mceAction: 'close' });
            });
        </script>
    </body>
</html>

PHPファイルはこのような感じでjavascriptが大事ここで、
submitを行っています。
当然、JSON形式で返却しましょう。公式ページにも書かれいますが
mceActionで制御しましょう。
プラグイン側のJSは下記のようになります。

(function() {
    tinymce.create('tinymce.plugins.language_boon', {
        init : function( ed,  url) {
            console.log(ed);
            act =function(ed)
            {
                ed.windowManager.openUrl(
                    {
                    type: 'panel',
                    title: '恩恵を受ける',
                    url:url + "/language_boon.php",
                    onMessage:function(api, details){
                      console.log(api, details);
                      console.log('オレオレjapan', details.data.L_japan);
                      console.log('オレオレEnglish', details.data.L_English);
                   }
                });
            };
            // window.addEventListener('message', function (event) {
            //   console.log(event);
            //   var data = event.data;
            //   console.log(data.data);
            //   if(ed.settings.id == data.data.id_){
            //     console.log('オレオレjapan', data.data.L_japan);
            //     console.log('オレオレEnglish', data.data.L_English);
            //   }
            // });
              ed.ui.registry.addButton('language_boon',{
                title : '恩恵を受ける',
                text: '恩恵',
                onAction:function(){act(ed)}
            });
        },
    getInfo : function() {
        return {
            longname : 'tinymce.plugins.language_boon',
            author : 'taoka',
            authorurl : 'https://zip358.com',
            infourl : 'https://zip358.com',
            version : '1.0'
        };
    }
});
        tinymce.PluginManager.add('language_boon', tinymce.plugins.language_boon);
})();

公式ページは下記のリンクより
https://www.tiny.cloud/docs/ui-components/urldialog/#urldialoginstanceapi
サンプルサイトはこちら
https://zip358.com/tool/editor/
 
 

タグ

4.0, 5.0, open, openUrl, TinyMCE, windowMan, windowManager, オリジナル, こと, サイト, ファイル, プラグイン, ページ, レスポンス, , 会社, , 作成, 使用, 例題, 全て, 公式, 原文, 唯一, 外部, 嫌い, 山ほど, 情報, 方法, 日本語, 機能, 残念, 答え, 簡単, 英語, 記載, , 開発,

文字の置き換え と コールバック

2019.06.08

Logging

お蔵入りしたコードです。文字の置き換えとコールバック関数です。
置換する際に、それぞれ違う文字に置き換えて表示したいなどに
使用すると便利かなと思います。

See the Pen 文字の置き換え と コールバック by taoka (@taoka-toshiaki) on CodePen.0

タグ

0, 265, BeXapO, BY, codepen, default, embed, gt, hash, Height, href, html, ID, io, lt, ON, Pen, result, See, slug, tab, taoka, taoka-toshiaki, The, theme, user, お蔵入り, コード, コール, それぞれ, バック, 使用, 便利, 文字, 置換, 表示, 関数, ,

MYSQLのif文みたいなものを使用する機会が物凄く少ない気がする。

2019.05.18

Logging

### mysql case = if文みたいなもの
```sql
select namae,tensu
case when (tensu >= 75 and tensu <= 80)  then '可'
when (tensu >= 25 and tensu < 75)  then '否' else '???' end as kahi
from tbl;
table name tbl
|namae|tensu|
|---|---|
|hirose|77|
|non|76|
|arimura|78|
|aragaki|80|

mysql case = if文みたいなものを使用する機会が物凄く少ない気がする。
プログラム言語って使用しなければ抜け落ちるです。
自分の場合、たぶん長期的な記憶に障害があって抜け落ちるですw🙄。
メモしたことすら忘れてしまう…これは痛い老害?。

でも、好きな事は大体覚えていますね、概念的な事を覚えていたら大丈夫です😌。
 
 

タグ

```, 25, 39, 75, 76, 77, 78, 80, and, aragaki, arimura, as, case, else, end, from, gt, hirose, if, kahi, lt, MYSQL, namae, name, non, select, SQL, TABLE, tbl, tensu, then, when, こと, プログラム, メモ, もの, 使用, , , 場合, , 機会, , 自分, 言語, 記憶, 障害,

全ての定義済の変数を配列で返す

2019.03.16

Logging

全ての定義済の変数を配列で返す関数です。
全てなのでとってきて欲しくないものまでも取ってきます。
なのでそういうのはunsetします。
ちなみに似たようなのでcompactという関数がPHPには存在します。
何に使用する場合に便利かは人それぞれ違いますが
自分の場合はテンプレートエンジンを使用するときに重宝してます。
テンプレートエンジン・・・TwigやSmartyなど

<?php
$a = "abc";
$b = array(1,2,3);
$c = 123;
$vars = get_defined_vars();
unset($_COOKIE);
unset($_POST);
unset($_GET);
unset($_FILES);
unset($GLOBALS);
foreach ($vars as $key => $value) {
    var_dump($key);
    var_dump($value);
}
//...
var_dump($vars);

 

タグ

, 2, , ABC, array, as, compact, COOKIE, defined, dump, files, foreach, GET, GLOBALS, gt, key, lt, php, POST, Smarty, Twig, unset, value, var, vars, エンジン, それぞれ, テンプレート, とき, もの, , , 使用, 便利, 全て, 場合, 変数, 存在, 定義, 自分, 配列, 重宝, 関数,

PHPの無名関数の使い道が未だにわからないし…

2019.03.09

Logging

<?php
$mumei = function()
{
    if($cnt = func_get_args())
    {
        foreach($cnt as $key=>$value)
        {
            print func_get_arg($key);
        }
    }
};
$mumei(1,2,3,4,5,6);

わからない、未だにわからないし、使う機会が少ないのだけどいったいどこに使うのか。

追記:
2021年の今、無名関数を使ってコードを書くことが増えました、PHP8になりオブジェクト指向が洗練されてきています。今後、無名関数を使用してコードを書くこともあると思います。因みにJSの方が無名関数でコードを書くことが多いですね。

PHPでの無名関数の問題点は、頻繁に無名関数ばかり使用していると他のエンジニアが読みづらく感じる所かもしれません。特にPHPの昔のバージョンになればなる程、読みづらいと思います。

タグ

, 2, 2021, , 4, 5, 6, 8, arg, args, as, cnt, foreach, FUNC, function, GET, gt, if, JS, key, lt, mumei, php, print, value, エンジニア, オブジェクト, コード, こと, どこ, , 今後, , 使い道, 使用, 問題点, , 指向, , 未だ, 機会, 洗練, 無名, 追記, 関数, 頻繁,

年賀状CSVを作りました。SJISで保存してください。

2018.12.30

Logging

https://zip358.com/tool/nenga/
ブラウザ上で完結しています。
禁則処理などはありません、ただ純粋に入力したものが
CSV形式の文字列で出力されます。
これ何のために使えるかといえば
https://nenga.yu-bin.jp/
こちらのサイトで住所録を登録する際に使用できます。
タイトルにも描きましたがSJISの文字コードで出力をお願い致します、
また、データベースに保持などはしていないため
リロードしてしまうと全てのデータが消えてしまいます。
これを作った経緯。
自分が郵便年賀.jpで登録するのが面倒だったため作りました。

タグ

358, com, CSV, jp, nenga, SJIS, tool, yu-bin, zip, お願い, コード, こちら, これ, サイト, タイトル, ため, データ, データベース, ブラウザ, もの, リロード, 住所, , 使用, 保存, 保持, 入力, 全て, 処理, 出力, 完結, 年賀, 年賀状, 形式, 文字, 文字列, 登録, 禁則, 純粋, 経緯, 自分, 郵便, , 面倒,