[Olein_jp]

【当該サイトのURL】https://andpenso.biz/?page_id=553&preview=true

このURLだと、多分ページを制作中のプレビューURLになるので、現在の様子を確認することができませんー。

差し支えなければ、上記キャプチャいただいたページのURLを共有いただくことはできますかー？

♥ 0

いいねをした人: 居ません

[Olein_jp]

個人的な認識ですが、Snow Monkey で添付画像のようなヘッダーを作る場合、テンプレートの上書きしかないような気がします。

メンテナンス性なども考慮された上で検討されると良いと思います。

♥ 3

いいねをした人: 居ません

[Olein_jp]

#page-top に絶対配置の情報が記載されているので、追加CSSなどから上書きする形でカスタマイズできるかと思います。

♥ 1

いいねをした人: 居ません

[Olein_jp]

パターン→Hedaings→ Heading 3で制作したがボタン

同様に再現してみたのですが、こちらでは確認することができませんでした。

共有できるURL（上記のものは管理画面プラグイン一覧ページのURLかと思われます）もしくは、該当するボタンをフォーカスして開発者ツールを開いた画面をキャプチャした画像（該当部分に関係するCSS記述の確認のため）などの提供は可能でしょうか？

ご確認をお願いいたします。

♥ 0

いいねをした人: 居ません

[Olein_jp]

何がまずいでしょうか？

なぜうまくできないかをデバックすることも大切な学習だと思うので、あえて答えを書かずにヒントだけ書いてみますね。

まずは、エラーが出たらエラーテキストで検索してみましょう。それを見て、修正をする、の繰り返しです。

また、変数の中身などを確認する場合には var_dump( $atr ) とかで確認してみてください。

PHP: var_dump – Manual

www.php.net

また、ショートコードでHTMLを出力したい場合には以下のドキュメントのアンカーリンクのセクションが参考になるかと思います。

WordPressショートコード超詳細ガイド（自作例も紹介）

WordPressのショートコードは非常に便利です！本記事ではショートコードの概要を説明して、カスタムWordPressショートコードの作り方を紹介します。（コードの例も付きま…

kinsta.com

♥ 1

いいねをした人: 居ません

[Olein_jp]

まずはこちらの記事をご確認頂いて、色々と試してみたらうまく行くかもしれません！（手前の記事で申し訳ないです！）

My Snow Monkey（プラグイン）でショートコードを作って任意のHTMLを出力する方法

Snow Monkey公式フォーラムでこのようなやりとりがありました。 https://snow-monkey…

happy-snow-monkey.olein-design.com

♥ 1

いいねをした人: 居ません

[Olein_jp]

後藤さん

試みてみましたら無事解決いたしました。ありがとうございました。

解決されて良かったです！

今回は一般的な内容かもしれないと判断し、こちらで質問させていただきましたが、

おっしゃるとおり、著作権の関係もありますため、以後は個別にご相談をさせていただければ幸いです。

はい、内容自体は一般的な内容ですのでサポートフォーラムでご質問頂くべきものであることは間違い無いと思います。ただ、課題の元が「Snow Monkey（とその関連プロダクト）」ではなく「私が作成した動画」という側面があったので、Snow Monkey サポートフォーラムのリソースを使っていいものかと不安になったということです（僕自身は良いのですが、僕発信の情報リソースにSnow Monkeyリソースを使って悪いな…というところです）。

この度はお手間を取らせてしまったこと、またご不快な思いをさせてしまい申し訳ございませんでした。

いえいえ、動画の視聴も大変喜んでおりますし、不快な思いはしておりませんのでご安心ください。ただ、ここだけの話、この動画シリーズでデモサイトを公開取り下げる事態が過去に発生していたりして、色々とあったりもしまして…。

今後の個人的な情報発信の考察に活用させていただきます。ありがとうございます。ぜひ今後も Snow Monkey サポートフォーラム、ご活用くださいませ！

♥ 0

いいねをした人: 居ません

[Olein_jp]

ご返答ありがとうございました。

該当ウェブサイトの素材を配布されている方がみえる可能性を考えたので、その点は安心しました。

拝見したところ、個人としてお仕事をされているとお見受けいたしましたので、すでにご存知かと思いますが、著作権法第三十条をご理解いただいた上での使用に止めるようお願い致します。

—

該当する箇所ですが、開発者ツールでソースコードを確認していただくと以下のようなコードを確認することができるかと思います。

***:after {
    content: "";
    background: url([PATH_TO_IMAGE]/bg-heading-xlg.png) no-repeat center top;
    width: 164px;
    height: 134px;
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    font-family: "Open Sans", "YuGothic", "游ゴシック", sans-serif;
    z-index: 1;
    margin-left: -10px;
}

上記を参考に挑戦していただければと思います。

—

以下、本題から外れますが、当方が作成した Snow Monkey を活用したウェブサイト作成動画に関する質問を Snow Monkey サポートフォーラムで行われることが、適切な利用方法かどうか疑問を感じます。

というのも、偶然私がこのトピックを拝見したので返答していますが、他の方であれば Snow Monkey コミュニティの方々のリソースを、私が作った動画チュートリアルに関する質問に使われることが、最適とは考えにくいです。（キタジマさんに本件は確認していませんので、私の個人的な感想です）

少なからず、私の作成した動画チュートリアルなどへのご質問は、Youtubeコメント欄もしくは個別にTwitterでメンションを飛ばしていただくような形の方が良いかと感じました。

個人的な感想ですが、ご確認いただけますと幸いです。

♥ 0

いいねをした人: 居ません

[Olein_jp]

個人的な学習に使われる場合には、著作権の問題は発生しないという認識を僕は持っているので、そのような用途であれば問題ないと思われます。

ただ、懸念として

学習に使われている見出し背景に利用する画像は、ご自身で実際の該当サイトから調達されているものでしょうか？それともどこかで配布されているものですか？

と質問させて頂いているように、

• 個人的に画像をダウンロードして学習に使われている
• どこか当方の把握していない所で誰かが採取した画像が教材のように配布されている

こちらを確認させて下さい。前者であれば問題ありませんが、後者の場合は対応が必要になります。

こちらお返事頂きますようお願い致します。

♥ 0

いいねをした人: 居ません

[Olein_jp]

1)そもそも、【メディアと文章】向けではアップする画像サイズをもっと小さくするのがよいのでしょうか。
WordPress上で画像サイズを小さくする方法はあるのでしょうか。

解決されたい問題を解消する助けにはならないと思われますが、WordPressにアップロードされている画像データを編集したい場合には、メディアから該当する画像を選択して編集することでリサイズなど可能になります。適材適所でご活用ください。

2)【メディアと文章】ではスマホ、タブレット向けとで、挿入画像を選択できないのでしょうか。

現状では、標準ブロック・Snow Monkey Blocksの両メディアと文章ブロックには、そのような機能は搭載されていませんね。

3)PC同様、画像を横並びのまま保持する方法はありますか。

考え方としては、ご存知とは思いますが Snow Monkey のCSS設計としてモバイルファーストになっているため、スマホ→タブレット→PCという順にメディアクエリを利用して上書きしていく形で書かれています。

ですので、厳密に言うと「PC同様」にするのではなく、「PC表示に採用されているスタイルを、スマホ・タブレットにも採用する」ようにメディアクエリを利用してCSSカスタマイズを行えば実現は可能かと思います。

♥ 1

いいねをした人: 居ません

[Olein_jp]

公開URLを共有いただけないと、素材画像の提供もないので確実な返答をしにくいです。

ですが、恐らく Snow Monkey の利用方法を学習する上で私が作成した動画をご覧になって進められているのかと思いますので、公開可能な状態にすることは著作権の関係上無理だと思います。

回答をする前に一点確認させていただきたいのですが、後藤さんが学習に使われている見出し背景に利用する画像は、ご自身で実際の該当サイトから調達されているものでしょうか？それともどこかで配布されているものですか？

♥ 0

いいねをした人: 居ません

[Olein_jp]

アドセンスのことを指されていると勘違いしていました！

上記に添付いただいた「Google広告」とは、みなさんがGoogle検索をされた際に任意のキーワードに対して広告枠が検索結果上部に掲載されると思うのですが、そちらに対して「広告出稿」をするというサービスという認識をしています。

上記のような検索結果時に表示される広告枠を任意のウェブサイトに掲載したい、ということでしょうか…？

追記します。

Google広告に出稿をして、そのトラック用のコードを掲載したいということですかね？であれば、Google広告について詳しくないのでなんとも言えないのですが、タグマネージャーで一括管理できるような気がします。

別途、<script>〜</script> のようなタグを埋め込まないといけないのであれば、<head>〜</head> であれば wp_head() へ、<body> の直後であれば wp_body_open() などへフックをして出力することもできると思います。

♥ 0

いいねをした人: 居ません

[Olein_jp]

カスタマイズ内にてアドセンスコードを設定することで、テーマ側がよしなに広告を設定してくれるようになっています。

任意の場所に出力したい場合には、ウィジェットやフックを経由して管理することも可能です。

♥ 0

いいねをした人: 居ません

[Olein_jp]

「高度な設定」→「追加CSSクラス」でクラス名を挿入すると、該当ブロックの一番外側の要素に付与されます。

そのクラス名とその中にある（または併記されている）CSSクラス名（例えば .smb-panel や .smb-panel__item など）を利用してCSSカスタマイズをしていく流れになることが一般的かと思います。

セレクタとして指定が必要な場合、
これらセクションや共通ブロックで使われているクラスの一覧表などはどこかにありますでしょうか？
それとも都度「Chromeデベロッパー・ツール」で確認することになりますか？

現状、Snow Monkey ではクラス名などの一覧となるドキュメントはありません。というのも、アップデート頻度が高いためドキュメント整備リソースが確保できないという理由と、そもそもカスタマイズする際にはブラウザの開発者ツールで最終的には確認することになるため、このような形に落ち着いている状況です。

ですので、開発者ツールで確認をしながらカスタマイズを進めていく形になるかと思います。

♥ 3

いいねをした人:

[Olein_jp]

ブロックの追加⇒テーブルを挿入し

コアブロックで表を作るのではなく、カスタムHTMLブロックに書かれた表に対して下線のみCSS装飾したいということですか？

♥ 2

いいねをした人: 居ません

[投稿者]

投稿