HP作成」カテゴリーアーカイブ

写真が横になる

ここのブログに乗せた写真が、意図せず横になって困っていた。

wordpressで作ったHPでは度々おこる現象らしい。

何やら、写真の詳細情報「EXIF」の中に写真の向きの情報が有り、HPに乗せて向きを変えても、そのEXIFにある向き情報は書き換えられず、その向きで表示されてしまうようだ。

写真の向き

写真の向き

今まで、気が付くとその写真を編集し「オリジナルを編集」で向きを、右に90°、左に90°と、「動かして直す」動作をし「保存」「更新」でHP上では直っていた。

しかし、それをクリックし拡大表示させると、横になったまま直っていない。これの対処が出来なかった。

写真のEXIFがいじれるソフトで書きかえればいいのは分かったが、それは面倒。

wordpressのアドインで検索。

WP Smush

結局「WP Smush」というプラグインで解決できた。

これは、写真データを圧縮するのが主のプラグインだが、写真データの軽量化目的ででEXIFデータも削除が出来るようだ。

インストール、有効化で初期設定の2番目

smush

smush

「Preserve my image EXIF date」をOFFにすることで、EXIFデータを保存せずに圧縮できるようだ。(もちろん下の方にある「Update Settings」を押して更新させるのを忘れずに)

この設定だけ済ませば、後はいつものように写真を追加するだけで処理をしてくれる。

すこし写真のアップロード時に処理を待たされるようになったが、これはしょうがない。

いくつかテストしたが、HPプレビューでもクリックして拡大ポップアップさせても横にならなかった。

すでにHPにアップロードされている物は、勝手に直るわけではなく、「横になってしまった写真」、もしくは「直したがポップアップで横になってしまう写真」をクリックして、「編集」を押し、「置換」を押し、その写真にチェックが入っているまま、Smush[今すぐ圧縮!]ボタンを押し、更新することで直すことが出来た。

smushボタン

smushボタン

これで一つ問題が解決できた!

 

固定ページとメニュー

テーマの変更

ブログとは直接関係のない固定ページ(ホームページ)を作ろうと思った。

しかし、新規に固定ページを作っても、最新のブログやカレンダーなどのウィジェットが表示される。それらを消すと、ブログのページでも消えてしまう。

ブログと別スタイルのページを作りたく、調べたが、少し難しそうだ。

一番手っ取り早いのがテーマの変更。

テーマによって固定ページのメニューやウィジェットが変更できるものがあるらしい。

今までテーマ「Twenty Sixteen」を使っていたが、「Twenty Twele」に変えた。

固定ページの編集時、「固定ページの属性」に テンプレートが選べるようになり、ブログページと違ったページ作りが出来るようになった。

しかし、もう少しスキルを上げ、テンプレートに頼らず出来るようにならねば・・・

 

google map

先日の投稿で、地図を入れようと思い、入れ方を調べてみた。

TCD Google Maps

”wordpress” + ”googlemap” で検索。いろいろ出てきてよくわからない。

「TCD Google Maps」が簡単だと言う書き込みを見たので、試にダウンロード~有効化。

TCD Google Mapsのメニューが追加され、開いてみると、表示させたい地図の住所を入力し、地図の縮尺、大きさ、など色々選べて、わかりやすい。

入力欄にAPIと有り、よくわからないが、「TCD Google Maps」プラグインの「詳細を表示」で説明がある。

書いてある通りにGoogle Maps API のページに行き、キーを取得、コピーして設定にあった入力欄にペーストするだけ。

一番下に出来上がっている文字列 map address=…….. をコピーして、投稿に張り付けるだけだった。

半信半疑でページを表示すると、しっかり地図が貼られている。意外と簡単だった。

この文字列を大括弧 でくくると地図になるのか。よくできている。

map address=”東京都千代田区千代田1−1″ width=”300px” height=”300px” api=”AIzaSyBai7TlIiSA9aglxG2X38O3GM5GnOWCq_g” theme=”” class=” ” zoom=”18″ draggable=”true” controls=”true”

[map address=”東京都千代田区千代田1−1″ width=”300px” height=”300px” api=”AIzaSyBai7TlIiSA9aglxG2X38O3GM5GnOWCq_g” theme=”” class=” ” zoom=”18″ draggable=”true” controls=”true”]

まだまだ序の口、覚えなければいけないことだらけだ。

Easy Google Fonts

以前の投稿、フォントを変えるのに奮闘した際、Google提供のwebフォント「Easy Google Fonts」を目にした。

TS Webfontのモリサワフォントで足りない訳ではないが、GoogleFontが気になってしまった。

無料だし、入れてみた。

Easy Google Fontインストール

Easy Google Fontインストール

インストールし「有効化」。

「settings」は??後回し・・・

 

 

 

 

 

「外観」-「カスタマイズ」の中に「Typography」で設定していくようだ。

wordpress外観-カスタマイズ

wordpress外観-カスタマイズ

Paragraphs(=段落)、からHeading 1~6(見出し1~6)を各々設定するのだろう。わかりやすい。

まず、Paragraphsの[Edit Font▼]を押してみた。

paragraphs edit font

paragraphs edit font

まずは[Styles]のタブが開かれ、フォントを選ぶ、いろいろな地域、フォントファミリーから選べるが、日本語ユーザーはどれもピンとこない。

[Appearance]タブではフォントの色やサイズ文字間などの指定。・・・なぜ「色を選択」だけ日本語?

[Positioning]では行間や文字装飾。

 

変更箇所は、右に表示されているブログのフォントが瞬時に対応しプレビューできるので分りやすい。

やはりフォントの多くはがアルファベットのみのようだ。

固定ページ

やはり今日もWordPressのネタ。

良くわからずHPづくりを初めて、無料と評判の良さでWordPressに行き着き、いつの間にか「ブログ」になっていた。

これはこれで更新の都合も良かったのだが、「ホームページ」と、なると形式が?

メニューで「固定ページ」は前々から見ていたので、「これで作るのだろう。」と、想像はしていた。

これといった固定ページ用のネタは考えていなかったが、試に作ってみた。ブログのTOPページ的なものにして、「外観」-「カスタマイズ」-「ホームページ設定」でブログとの位置関係も簡単に出来た。

簡単に済ませば簡単だが、デザインやらカスタマイズで凝るには結構、奥深そう。

また調べて頑張るか・・

 

Back Up

WordPressのアップデートが有るようで、”今すぐ更新してください”と書いてある。

しかし、アップデートの前にバックアップ取ってくれ、との記載が・・。

調べたところ、プラグインで簡単にできるらしい。「プラグインを追加」の所で「back up」で検索。一番最初にヒットし、最もインストール数の多い「Updraft Plus」を入れることにした。

プラグインを追加updraft

プラグインを追加updraft

 

 

 

 

「今すぐインストール」を押し。インストールが終わるとボタンが「有効化」に変わる。すぐさま「有効化」を押す。

追加されたupdraft

追加されたupdraft

 

 

 

 

プラグインに追加されたので、設定を押す。

updraft設定

updraft設定

 

 

 

 

早速「今すぐバックアップ」を押してみる。が・・・・・

updraftストレージ未設定

updraftストレージ未設定

 

 

 

 

 

なるほど、何処にバックアップしたら良いか判らん、ということか。そりゃそうだ。

「キャンセル」して「設定」を選ぶ。

updraftストレージ設定

updraftストレージ設定

 

 

 

 

 

「Google Drive」を選んでみた。

updraftストレージgoogleに設定

updraftストレージgoogleに設定

 

 

 

 

 

 

良くわからないが、このままで良さそうなので、そのまま「変更を保存」を押す。

updraftストレージgoogleに設定メッセージ

updraftストレージgoogleに設定メッセージ

「Follow this…..」を押すと

googleのアカウント選択が出た。

環境によってはgoogleのログインなどが出るのだと思う。

進めていくと、

updraftストレージgoogleリクエスト

updraftストレージgoogleリクエスト

 

 

アクセス確認で「許可」を押す。

 

 

 

 

updraftコンプリート

updraftコンプリート

 

「Complete setup」を押す。

 

 

updraft設定

updraft設定

再び、設定の最初の画面。

今度こそ「今すぐバックアップ」。

 

updraftストレージ設定後

updraftストレージ設定後

 

今度は、ストレージに”保存されない・・”旨のメセージがなかった。

「今すぐバックアップ」を押す。

 

 

updraftバックアップ進行

updraftバックアップ進行

 

バックアップしています!

あとでgoogle driveを確認したところ、「UpdraftPlus」のフォルダが作られファイルが入ってました。

おそらくバックアップ大丈夫でしょう。

もう少し調べて自動バックアップなどを設定しないといけませんね。

font

そういえば何日か前、プラグインのところで「モリサワフォント」が利用出来るってのを見つけて有効化にした。

しかし、フォントが変わるでもなく、どこかでフォントが選べるようになったのかも判らない。

「TS Webfont for お名前.com」プラグインの[詳細を表示]を見たところ、お名前.comの共用サーバーSDコントロールパネルで設定が必要らしい。

お名前.comの共用サーバーにログインする。

 

 

 

 

 

 

お名前ドットコムコントロールパネル

お名前ドットコムコントロールパネル

 

WEBフォントを選ぶ。

 

 

 

 

 

お名前ドットコムwebフォントURL設定

お名前ドットコムwebフォントURL設定

 

設定を押す。

あとは確認画面が出て、決定を押すだけだった。

 

 

これで自分のブログに戻り、新規投稿などやってみたが、フォントが変わっていたりフォントを選ぶような物もない。

TypeSquare Webfonts Plugin for お名前.com設定

TypeSquare Webfonts Plugin for お名前.com設定

 

ここで設定するようだ。

・・こんなの有ったかな?

 

 

フォントは一連のテーマ化されているのか。

その他カスタマイズも出来そう。とりあえず「ベーシック」を選んで、[フォントテーマを更新する]を押してみる。”フォントテーマの設定に成功しました。” のメッセージが出た。

前の投稿のページ、新規投稿と見てみるが一向に変わった気配がない。

・・・・・・・

結局、編集ページでは変わらず、プレビューや通常のページ閲覧時にはフォントが変わっていた。

Google Search Console

WordPressのツールから「WEBサイト認証ツール」を使ってGoogle検索などに登録できるらしい。

wordpressツールページ

wordpressツールページ

 

早速、「Google Search Console」を押してみる。

 

 

Googleにログインしていない場合はログインしてからGoogle Search Consoleに入るようだ。

 

Google Search Consoleのページが開き、 [プロパティを追加] を押し、登録したいホームページアドレスを入力。

google search console別の方法

google search console別の方法

 

←赤枠の<meta…をコピーして、

このページはそのままにWordpressにもどる。

 

 

何故かできない↓

wordpressツールページ入力

wordpressツールページ入力

 

WordPressのツール「WEBサイト認証ツール」のGoogle Search Consoleの入力欄に入れ、最下[変更を保存]ボタンを押す。のだがwarningとか何やらでダメだった。

 

 

別の方法

google search console別の方法

google search console別の方法

Search Consoleの「別の方法」タブを押し、「HTMLタグ」を選択。

やはり同じmetaタグが出るがこれをコピー。

 

 

 

WordPressの[外観]の[テーマの編集]を開き、右の[テーマヘッダー]を開く。

wordpressテーマの編集

wordpressテーマの編集

wordpressヘッダーの編集

wordpressヘッダーの編集

 

 

 

 

HTMLの<head>の次にSearchConsoleでコピーした <meta xxxxxxx……をペースト。下の[ファイルを更新]ボタンを押す。

GoogleSearchConsoleに戻り[確認]ボタンを押す。

google Search Console確認

google Search Console確認

こうなれば成功。

 

 

 

HTTPを理解していなくても何とかなったが、少しでも解るように勉強しかなくては。

A・kis・met

昨日、前回の投稿にコメントが来ていた。何やら英語ではなく怪しげな外国語だ。内容はURLの数々。間違いなくスパムだ。

WordPressのプラグインに元から入っていた「A・kis・met」がスパム被害を防いでくれるらしい。早速、有効化してみる。

PIN番号が必要らしいが、WordPress.comでログインできるみたいだ。WordPress.comでログインすると、またプラン選択。無料は・・・

akismetプラン

akismetプラン

左の「Name Your Price」は「値段はお前が決めろ」という意味らしい。

それを選ぶと、何故かクレジットカードの絵とか、金額が表示されたページが出た。(画像を保存するのを忘れてしまった。)

ここでName Your Price。金額の入ったスライダーを一番左に持っていけば、0円になる。ちょっと悪い気がするが、今回はこれで進めた。

「CONTINUE」を押して、アクティブ化すれば完了。スパム回避、よろしくお願いします。

 

引用

WordPressでブログを作りはじめて、何とか投稿出来たが、解らないことが山ほどある。

素人なので仕方がないが、調べながらやって行こうと思う。

今日は、投稿を書く時、上にあるボタン “ ←これ、「引用」とは何か調べてみた。

漠然と引用の意味は分かるが、何故これが必要なのかはわからない。

使ってみるとこんな感じ↓

引用のテスト

何だかよくわからない。

ざっくり調べたところ、文字通り「引用」なので、どこかのページからのコピーや、本や他のメディアなどからの文章を載せた場合に、引用を宣言する。もちろん引用もとに許可を得なければならないだろう。

他人の文を勝手に使ってしまうと、刑罰、罰金の対象になる。許可を取ってちゃんとに借りたいものだ。

「“」 引用ボタンで引用を明示した場合、HTML内で引用文が宣言される。

これで見た目にも内容的にも、「借りてます」がはっきりする。

検索エンジンで「引用」宣言なく、他のページと同じ文がある場合、非常に心象が悪いらしい。