DRILL LANCER
フォーラムへの返信
-
投稿
-
WP-Sweepで掃除してみるのも有力かもしれません。
20文字というのは全角20文字でしょうか？かなり長いですね。
外観 → カスタマイズ → Lightning ヘッダーバナー
にて ヘッダーバナーを非表示にする にチェックを入れたら
737pxの幅までは1行で表示可能ですが、それ以下になると２行になります。（ロゴなしの場合）どんどん画面を小さくしていくと最終的には 10文字× 2行 （ロゴ無しの場合）になります。
.navbar-brand.siteHeader_logo{ font-size:24px; }のようにして文字サイズを調整するなり、
早急にロゴを作成して対応する等の対応をしたほうがいいかもしれません。
Twitterでカードを生成するには、
「VK All in One Expansion Unit」の「SNS Settings」において以下の３つを満たす必要があります。- twitterアカウントのテキストエリアにユーザー名を入力
- OGタグにチェックを入れる
- Twitterカードタグを入れる
また、アイキャッチ画像が確実に設定されているかを確認してみてください。
上記をすべて満たした場合、個別記事のソースコードのOGPの部分は添付画像のようになります。
過去のツイートに反映するのは至難の業のようなので次回投稿から試してみてください。
以上を確認してみてください。「VK All in One Expansion Unit」の「SNS Settings」の
「twitterアカウント」には何か入力していますか？なにも入力していないと「Twitter Card」が有効にならないようです。
変更後、サーバー & ブラウザのキャッシュの削除を忘れずに。
P.S.
画像はわざわざ外部サーバーにアップロードしなくても
下の部分の「ファイルを選択」からアップロードできるようになりました。まず、下記ページを読まれれると良いでしょう。（ウィジェットを連発しているようなので）
①LTG 全幅見出しウィジェットを使用していると思われます。
②LTG PR コンテンツウィジェットを使用していると思われます「JetPack」や「All in One Seo Pack」等の他のプラグインでOGPを出力していたりしませんか？
また、「VK All in One Expansion Unit」の「デフォルトのOGPイメージ」の設定を空にするとどうなりますか？そのコードだとWordPressがあるフォルダ以下全体にBASIC認証がかかってしまいます。
私が使用しているBasic認証のコードは下記のとおりです。
私が使用しているサーバーは
/home/hogehoge/public_html/sub1.example1.com
/home/hogehoge/public_html/sub2.example1.com
/home/hogehoge/public_html/sub1.example2.com
/home/hogehoge/public_html/sub2.example2.com
という構造をしています。①wp-login.phpがあるディレクトリの.htaccess
<Files "wp-login.php"> AuthUserFile /home/hogehoge/public_html/.htpasswd AuthGroupFile /dev/null Authname "Please enter your ID and password" Authtype Basic require valid-user </Files>②wp-adminディレクトリの.htaccess
AuthUserFile /home/hogehoge/public_html/.htpasswd AuthGroupFile /dev/null Authname "Please enter your ID and password" Authtype Basic require valid-user <FilesMatch "(admin-ajax.php)$"> Satisfy Any Order allow,deny Allow from all Deny from none </FilesMatch>P.S.
解決したなら解決したとしっかり返答しないと後々見放されるかもしれないのでその点は気をつけたほうが良いでしょう。下記を実行してみてください。
①子テーマを作成して有効化
②親テーマのfront-page.phpを子テーマにコピー
③作成したarchive.phpを削除（邪魔になるため）
④子テーマにmodule_loop_home.phpを作成し下記のように記述
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <header> <?php get_template_part('module_loop_post_meta');?> <h1 class="entry-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1> </header> <div class="entry-body"> <?php the_content();?> </div><!-- [ /.entry-body ] --> </article>⑤子テーマのfront-page.phpの63行目あたりを下記のように変更
変更前
<?php get_template_part( 'module_loop_post' ); ?>変更後
<?php get_template_part( 'module_loop_home' ); ?>デザインはともかくとして、これで、記事全文（ページャー以下は除外）を表示できると思います。
あと、私は一顧客であり、JPNSTYLEを持っていないのでデザインについては保証できかねます。
この点はご了承ください。P.S.
ちなみに、module_loop_home.phpの中身はsingle.phpから拝借しています。参考になればと思います。アイキャッチを登録するのは避けられませんが、
本文の最初の画像を自動的にアイキャッチ画像に設定する方法ならあります。上記を試して見てください。
自分のサイトアドレスをTwitterなどに貼ると、アドレスを貼っただけで、特定の画像が自動的にでかでかと表示されます。
OGPというやつですね。特定の画像というのはアイキャッチ画像です。
Vektor社のTwitter（画像参照）もそんな感じですね。
おそらく、「VK All in One Expansion Unit」では
Twitterでは「Summary Card with Large Image」を
出力するように指定しているのだと思います。私は一顧客なので、対応することはできません。
便乗する意味で、書きますが、
Twitterカードを「Summary Card」か「Summary Card with Large Image」
で選べるよう設定できる項目を追加していただけたら幸いです。iframeは親要素の幅を無視して表示されるので、
レスポンシブにするには上記のようなCSSを組むか、
JSで対応するかしかないようです。ちなみにvimeoでは貼り付けタグにもれなくレスポンシブ用のJSがついてくるようでした。
とりあえずギャラリー版とカラム版ができたので画像付きで投稿します。
- 説明文はどちらもキャプションを仕様しています。
- どちらの画像も上がギャラリー版、下がカラム版です。
- Editor.jpg がGutenbergでの表示、Site.jpg はサイト上の表示
カラムブロックでカラム数を変更するにはマウスカーソルを
カラムブロック左上にもっていくと表示される六文銭（Editor.jpg 参照）
をクリックすると右側のメニューでカラム数を変更できるようになります。画像の位置調整は画像選択直前（Select_image.jpg）の状態で決めないと
位置を変えるのはかなり面倒です。位置決めする際には
六文銭を掴んでドラッグ＆ドロップで位置を変えられます。
位置を決める際は上部に青い線が表示されるので参考にしてみてください。Gutenbergの肝はどうもこの六文銭にあるようです。
P.S.
あのアイコンは六文銭しか表現が思いつかなかったのであえてこう表現しました。
