引用

今日は今までに一度も使ったことがない「引用」を使用してみる!
間違ったらごめんなさい。

3−8.引用

役割 … 引用ブロックを挿入する
タグ … <blockquote>

引用	引用ボックスを挿入する

役割 … 引用ブロックを挿入する

タグ … <blockquote>

https://bazubu.com/how-to-use-gutenberg-36143.html

野性の証明カバー

↑人気ブログランキングに参加しています。ポチっと1票を!

複数のブロックを1つにまとめる?

地崎バラ園のバラ
  • 第1のブロックは画像の中を指定。
  • 第2のブロックはこのブロックで段落を指定。
  • これをテキストの範囲を指定する同じ要領で指定
  • どうなるか?

第1のブロックは画像の中を指定。
第2のブロックはこのブロックで段落を指定。
これをテキストの範囲を指定する同じ要領で指定。
どうなるか?

  • 段落1(段落4はインライン画像です)
  • 段落2
  • 段落3
  • 段落4 インライン画像用
  • 段落5
↑人気ブログランキングに参加しています。ポチっと1票を!

再利用可能・保存と呼び出し

再利用可能なカバー画像と人気ブログ・バナーを登録した。

野性の証明カバー

野性の証明カバー

海鮮丼(かに・いくら)
海鮮丼

上の画像はフルサイズを指定

↑人気ブログランキングに参加しています。ポチっと1票を!

Python-HTML-CSS with Enlighter in Gutenberg

19/11/26に掲載されたプログラム群をGutenbergとEnlighterを使って再掲します。

#!/usr/bin/python3      # app.py python
# -*- coding: utf-8 -*-
# app.py
 
from flask import Flask, redirect ,request,render_template
 
app = Flask(__name__)
 
@app.route("/check")
def check():
    return render_template('check.html')
 
@app.route('/',methods=['POST'])
def index():
    my_age = int(request.form["age"])
    my_name = request.form["name"]
    return render_template('index.html',age=my_age,name=my_name)
 
if __name__ == '__main__':
    app.run(debug=True)

上のコードはPython programです。

&lt;!DOCTYPE html>      &lt;!-- check.html -->
&lt;html lang="ja">
&lt;head>
    &lt;meta charset="UTF-8">
    &lt;title>年齢確認&lt;/title>
&lt;!--    &lt;link rel="stylesheet" type="text/css" href="{{url_for('static', filename='style.css')}}" />  -->
    &lt;link rel="stylesheet" type="text/css" href="static/css/style.css" />
&lt;/head>
&lt;body>
 
    &lt;form action="/" method="post">
        &lt;h1>年齢確認&lt;/h1>
        &lt;input type="text" name="name" placeholder="名前" required/>
        &lt;input type="number" name="age" placeholder="年齢" required/>
        &lt;button>年齢確認&lt;/button>
    &lt;/form>
 
&lt;/body>
&lt;/html>

上のプログラムはHTMLです。

&lt;!DOCTYPE html>  &lt;!-- index.html -->
&lt;html lang="ja">
    &lt;head>
        &lt;meta charset="UTF-8">
        &lt;title>18禁のサイト&lt;/title>
&lt;!--        &lt;link rel="stylesheet" type="text/css" href="style.css" />  -->
    &lt;link rel="stylesheet" type="text/css" href="static/css/style-04.css" />
        &lt;!--[if lt IE 9]>
        &lt;script src="http://html5shiv.googlecode.com/svn/trunk/html5.js">&lt;/script>
        &lt;![endif]-->
    &lt;/head>
    &lt;body>
    &lt;h1>射幸心を煽りまくるホームページ&lt;/h1>
    {% if age >= 18 %}
    {{name}}さんは18歳以上ですね。
    {% else %}
    {{name}}さんみたいな方はこんなHP見ちゃいけません?
    {% endif %}
 
    &lt;/body>
&lt;/html>

上のプログラムもHTMLです。

@charset 'utf-8';
body     {
    background: sandybrown;
    color: darkgreen;
    margin-left: 2m;
    margin-right: 2m;
}

上のコードはstyle.cssです。

@charset 'utf-8';
body     {
    background: violet;
    color: darkgreen;
    margin-left: 2m;
    margin-right: 2m;
}

上のコードはstyle-04.cssです。

文字が小さく見ずらい時はWindows拡大鏡をお使いください。Windows・キー + 「+」(プラス・キー)(Windows・キーはキーボード左下、左から3~4番目のキー。抜けるにはWindows・キー + 「ESCキー」を押します)

↑人気ブログランキングに参加しています。ポチっと1票を!

Gutenberg & LIQUID BLOCKS

カバー画像としてミカンの写真を使っています。オーバーレイの色は薄いブルーを使っています。

最近の何枚かの写真を使います。

5枚の写真をギャラリーとして使いました。

長兄からの贈り物

カバー画像としてミカンの写真を使っています。オーバーレイの色は薄いブルーを使っています。

音楽ファイルを挿入しています。ヘレンシャピロの「悲しき片思い」です。

↑当記事の作成に当たっては上のリンクの記事を参照しました。
LIQUID BLOCKSは無料
LIQUID PRESSは有料

函館塩ラーメン五稜郭の塩ラーメンといかめし

↑人気ブログランキングに参加しています。ポチっと1票を!

CodeMirror Blocksの構造解析

アイキャッチ画像は20日国分寺麻布茶房で行われた際のウェートレスによるプレッシャーのお茶出し。これにより講義は80分で切り上げた。店は混んでいたしこれは致しかたない。

<!-- /wp:codemirror-blocks/code-block -->

<!-- wp:codemirror-blocks/code-block {"lineNumbers":true} -->
<div class="wp-block-codemirror-blocks-code-block code-block"><pre>#!/usr/bin/python3
# -*- coding: utf-8 -*-
#demo32.py sessin managed &amp; username get
from flask import Flask, redirect, request, render_template, url_for, session
 
app = Flask(__name__)
 
@app.route('/login', methods=['GET', 'POST'])
def login():
    if request.method == 'POST':
        session['username'] = request.form['username']
        return redirect(url_for('index'))
    return render_template('demo07.html')


<!-- 中略 -->

@app.route('/logout')
def logout():
    session.pop('username', None)
    return redirect(url_for('func'))
 
app.secret_key = 'B0Qp89i/2xY F~XHH!jnVVLWX/,%QR'
 
if __name__ == '__main__':
    app.run(debug=True)</pre></div>
<!-- /wp:codemirror-blocks/code-block -->

<!-- wp:paragraph -->

プログラムの先頭部分と最後の部分<pre … </pre>でCodeが囲われている。

Line No無し
<!-- wp:codemirror-blocks/code-block -->
<div class="wp-block-codemirror-blocks-code-block code-block"><pre>#!/usr/bin/python3
# -*- coding: utf-8 -*-

Line番号が無しの場合は{“lineNumbers”:true}の指定がない。

<!-- wp:codemirror-blocks/code-block {"lineNumbers":true} -->
<div class="wp-block-codemirror-blocks-code-block code-block"><pre>#!/usr/bin/python3
# -*- coding: utf-8 -*-

Line番号がトゥルーになっている。

Line Wrapping無し
<!-- wp:codemirror-blocks/code-block {"lineNumbers":true,"lineWrapping":false} -->
<div class="wp-block-codemirror-blocks-code-block code-block"><pre>#!/usr/bin/python3
# -*- coding: utf-8 -*-

Line Wrapping無しの指定。

Editorable on frontend
<!-- wp:codemirror-blocks/code-block {"lineNumbers":true,"lineWrapping":false,"readOnly":true} -->
<div class="wp-block-codemirror-blocks-code-block code-block"><pre>#!/usr/bin/python3
# -*- coding: utf-8 -*-

Editorable on frontendを指定すると”readOnly”:trueになる。

上記指定による状況をプレビュー、ログオフで見ようと思ったが表示されなかった。

再びSyntaxHighlightその2

code Highlightしない件、ライン番号も表示されない。インデントはされる。

191215Editor内その1
191215Editor内その1

191215Editor内その1(まだ色表示されている-Line番号も表示されている)

191215Editor内その2
191215Editor内その2

191215Editor内その2(プレビューすると色が消えてしまった)

191215Editor内その3
191215Editor内その3

191215Editor内その3(再びプレビューすると色が復活)

191215Editor内その4
191215Editor外

191215Editor内その4(公開するとプレーンテキストになってしまう-Line番号も消えてしまう)

↑人気ブログランキングに参加しています。ポチっと1票を!

再びSyntaxHighlight

固定ページではSyntaxHighlightされた、さて投稿ページではどうなるか?

#!/usr/bin/python3
# -*- coding: utf-8 -*-
#demo32.py sessin managed & username get
from flask import Flask, redirect, request, render_template, url_for, session
 
app = Flask(__name__)
 
@app.route('/login', methods=['GET', 'POST'])
def login():
    if request.method == 'POST':
        session['username'] = request.form['username']
        return redirect(url_for('index'))
    return render_template('demo07.html')
 
@app.route('/program', methods=['GET', 'POST'])
def program():
    if request.method == 'POST':
        session['username'] = request.form['username']
        return redirect(url_for('index'))
    return render_template('demo03.html')
 
@app.route('/program1', methods=['GET', 'POST'])
def program1():
    if request.method == 'POST':
        session['username'] = request.form['username']
        return redirect(url_for('index'))
    return render_template('demo04.html')
 
@app.route('/program2', methods=['GET', 'POST'])
def program2():
    if request.method == 'POST':
        session['username'] = request.form['username']
        return redirect(url_for('index'))
    return render_template('demo05.html')
 
@app.route('/param/<parameter>')
def show_user_profile(parameter):
    if 'username' in session:
        html = render_template('demo07.html',name = str(parameter))        
        return html
    return 'You are not logged in. from param processing'
 
@app.route('/reset', methods=['GET', 'POST'])
def reset():
    session['username'] = 'monkey'
    return render_template('check31.html')
 
@app.route('/')
def func():
    if 'username' in session:
        html = render_template('demo07.html',name = str(session['username']))        
        return html
    return 'You are not logged in'
 
@app.route('/check', methods=['GET', 'POST'])
def check():
    if request.method == 'POST':
        session['username'] = request.form['username']
        return redirect(url_for('func'))
    return render_template('check31.html')
 
@app.route('/',methods=['POST'])
def index():
 
    if (request.form['attr'] == 'need'):
 
        success = False
        name = request.form["username"]
        passwd = request.form["pass"]
        att1 = request.form['attr']
        my_message = "keyword処理は?"
    else:
        con1 = request.arg.get('_ControlID')
        pg1 = int(request.arg.get('_PageID'))
        act1 = request.arg.get('_ActionID')
        flg1 = request.arg.get('getFlg')
        html = render_template('demo07.html', con = con1, pg = str(pg1), act = act1, flg = flg1)        
        return html
 
    user_data = [{"id":"カリフラワー", "pass":"hanakyabetsu"},{"id":"西行法師", "pass":"masako"},{"id":"monkey", "pass":"kayochan"},{"id":"program1", "pass":"pass1"}]
 
    for i in range(0, 10):
        if user_data[i]["id"] == name:
            if user_data[i]["pass"] == passwd:
                success = True
                session['username'] = name
                return render_template('demo07.html',suc=success,name=name,pas=passwd,msg=my_message,att=att1)
            else:
                continue
        else:
            continue
    success = False
    return render_template('demo07.html',suc=success,name=name,pas=passwd,msg=my_message,att=att1)
 
@app.route('/logout')
def logout():
    session.pop('username', None)
    return redirect(url_for('func'))
 
app.secret_key = 'B0Qp89i/2xY F~XHH!jnVVLWX/,%QR'
 
if __name__ == '__main__':
    app.run(debug=True)

Python program(CodeMirror Blocks in GutenbergではHighlight表示されている)

↑人気ブログランキングに参加しています。ポチっと1票を!

Gutenberg使用2回目

問題が私のオペミスかCodeMirror BlocksまたはGutenbergのバグかアイソレートするためにPythonプログラムをアップすることにする。

CodeMirror Blocks(ver1.0)でキチンと表示されていた(PowerShellのプログラムが)Version Up(ver1.1)したとたんGutenberg内では表示されるのに「更新」ボタンをクリックしてログアウトして「野性の証明」をリドロウしたとたんプログラムの表示がSyntaxHighlightされずにプレーンテキストとして表示されてしまう。問題が私のオペミスかCodeMirror BlocksまたはGutenbergのバグかアイソレートするためにPythonプログラムをアップすることにする。

※ →ログインして編集操作に入った時点ではPython codeはSyntax Highlightしている。「下書き保存」をして、「プレビュー」ボタンして画面を表示させてもまだ正しくHighlight表示しているが「公開する」または「更新」ボタンをクリックして、ログアウトして当ブログを表示すると、code部分はplain text表示になってしまっている。ブラウザを変えてみても現象は同じ。「公開する前にチェックを常に表示する。」にチェックを入れて「公開」をクリックした段階で、そのまま「投稿を表示」をクリックしても正しくハイライト表示される。実際にログアウトするとプレーンテキストになってしまう。

# -*- coding: utf-8 -*-
print("例:明治 42 年")
S = input("和暦:")
 
syear = 0
print(S.split())
items = S.split()
year = int(items[1])
 
if items[0] == "明治":
    syear = 1867 + year
elif str(items[0]) == "大正":
    syear = 1911 + year
elif items[0] == "昭和":
    syear = 1925 + year
elif items[0] == "平成":
    syear = 1988 + year
elif items[0] == "令和":
    syear = 2018 + year
else:
    print(items[0],"Error")
 
print("西暦",str(syear),"年")

編集内(Gutenberg)では上記のように正しく表示される。

ログアウトするとプレーンテキストになってしまう。

# -*- coding: utf-8 -*-
print("例:明治 42 年")
S = input("和暦:")
 
syear = 0
print(S.split())
items = S.split()
year = int(items[1])
 
if items[0] == "明治":
    syear = 1867 + year
elif str(items[0]) == "大正":
    syear = 1911 + year
elif items[0] == "昭和":
    syear = 1925 + year
elif items[0] == "平成":
    syear = 1988 + year
elif items[0] == "令和":
    syear = 2018 + year
else:
    print(items[0],"Error")
 
print("西暦",str(syear),"年")

WP SyntaxHighlighterを使うと正しく表示される。

Gutenberg移行後の最初の編集

今までクラシックエディターのみでWordPressの記事をアップしてきた。それが2022年には使えなくなるという情報である。それなら早くからのGutenbergへの移行が得策ではないかと考えた。

Headerの例(h2)

今までクラシックエディターのみでWordPressの記事をアップしてきた。
それが2022年には使えなくなるという情報である。
それなら早くからの移行が得策ではないかと考えた。
【Gutenberg疑問事項】

  1. ダッシュボードの機能操作性は変わらないのか?大丈夫!
  2. 編集画面上の:(アイコン)からメニューを開き「オプション」を選択

・文書パネル
・パーマリンク
・カテゴリー
・タグ
・アイキャッチ画像
・枠
・ディスカッション

  1. すべてにチェックを入れてよいか?(自動的にすべてON)!
  2. フォーマット(標準・アサイド・画像・・・)の処理は?ブロックで!
  3. カテゴリー→親子関係はあるか?ある!
  4. タグ(操作方法は同じか?)同じ!
  5. アイキャッチ画像(どこに、大きさは?)今までと一緒!
  6. ブログランキングのバナーの取り付け方法は同じか?再利用でOK!
  7. 抜粋は?ある!
  8. 投稿の表示方法(プレヴューか?)そう!
  9. ダッシュボードのメニューのplaceの仕方は同じか?同じ!
  10. WP SyntaxHighlightに代わる「Enlighter Sourcecode」でOK!
  11. カスケードメニューがどうなるか?今までと同じ!
  12. 月別アーカイブの常時表示はできるか?すべて表示!

疑問点はまだまだある!。見切り発車をすべきか?すべき!

 文字のサイズやヘッダーと段落の違いは分かりました。 バナーの貼り付け方も分かりました。
 まだまだ各ブロックの使い方が分かっていません。
 今後は編集方法などをネットで調べて、自由自在に使っていこうと思っています。

Gutenbergで行こうと思っています。

散歩道に咲いた小さな花

#USBログオフ時メッセージプロンプト処理
#メッセージ文
$messagePath="C:\temp\usbmessage.txt"
#ログ出力パス
$usbLOG="C:\temp\test\usblog.txt"
 
#--------------------------------------
#メッセージボックス
#--------------------------------------
function MessageBox([string]$p_value = "")
{
    [Void][Windows.Forms.MessageBox]::Show($p_value,"お知らせ","OK", "Warning")
}
 
 
$crUSB = Get-WmiObject -Class win32_usbhub | ? { $_.name -eq "USB 大容量記憶装置" } | ? { $_.status -eq  "OK" }
 
 
if ($crUSB) {
    write-output "$env:computername,$env:username,$(get-date)" >> $usbLOG
 
    #Windowsフォームのロード
    [Void][Reflection.Assembly]::LoadWithPartialName("System.Windows.Forms");
 
    MessageBox $([String]::Join("`r`n", (Get-Content $messagePath)))
    
}
#USBログオフ時メッセージプロンプト処理「PowerShell(.ps1)」 CodeMirror Blocks 使用(Gutenberg移行に伴ってWP SyntaxHighlighterは使用中止)
↑人気ブログランキングに参加しています。ポチっと1票を!
#USBログオフ時メッセージプロンプト処理
#メッセージ文
$messagePath="C:\temp\usbmessage.txt"
#ログ出力パス
$usbLOG="C:\temp\test\usblog.txt"
 
#--------------------------------------
#メッセージボックス
#--------------------------------------
function MessageBox([string]$p_value = "")
{
    [Void][Windows.Forms.MessageBox]::Show($p_value,"お知らせ","OK", "Warning")
}
 
 
$crUSB = Get-WmiObject -Class win32_usbhub | ? { $_.name -eq "USB 大容量記憶装置" } | ? { $_.status -eq  "OK" }
 
 
if ($crUSB) {
    write-output "$env:computername,$env:username,$(get-date)" >> $usbLOG
 
    #Windowsフォームのロード
    [Void][Reflection.Assembly]::LoadWithPartialName("System.Windows.Forms");
 
    MessageBox $([String]::Join("`r`n", (Get-Content $messagePath)))
    
}

WP SyntaxHighliterでPowershellのプログラムを表示させているところ。