-
投稿者検索結果
-
2018年4月24日 1:52 PM #2251
返信が含まれるトピック: パソコン表示の固定ページや記事のタイトルのサイズを小さくしたい
下記でいかないですかね?
@media (min-width: 64em) { .c-entry__header .c-entry__title { font-size: 2rem; } }
♥ 0Who liked: No user2018年4月24日 1:46 PM #2249返信が含まれるトピック: 共通ヘッダーとアイキャッチを別にしたい
アイキャッチ画像をヘッダー画像に使用するというもともとの仕様が良くなかったなぁと思っていました^^;
カスタマイザーや記事編集画面に「ページヘッダー用画像(これが設定されていたら優先表示)」
とか
「デフォルトヘッダー画像が設定されていたらアイキャッチ画像をヘッダー画像に使用しない」のようなチェックボックスを追加すれば、動作的には実現できるかなぁと思いますが、ちょっと使用面でも開発面でも多少混乱を呼び込んでしまいそうな気がするので、フィルターフックなりを追加して、やりたい人はやる、みたいな感じにしようかなと思います。(先日追加した「ヘッダー位置をモバイルのみに適用」も、もともとの仕様がわるかったために発生してしまった悪例だと思っています…)
使ったことはないですが、背景の色を判定して文字色を変更してくれるライブラリもあるみたいですね。
♥ 0Who liked: No user2018年4月23日 10:07 PM #2244返信が含まれるトピック: Font Awesome 5 対応について
ありがとうございます。
@importの方法は速度が気になっていたので勉強になりました。
‘font-weight: bold;’を指定しないと表示されないなどにはまったものの、CSS版でも今のところ問題なく動いています。ただ、まずはjs版を使う方法を試してみます。♥ 0Who liked: No user2018年4月22日 10:26 PM #2230返信が含まれるトピック: ブログカードが表示されなくなりました。
これは、 (URL は運営側で削除) の URL を指定したブログカードが表示されないということでしょうか?
それとも、ヘテムルとロリポップとkusanagiにおいて、どのサイトの URL を指定してもブログカードが表示されないということでしょうか?後者の場合、例えば YouTube の URL を貼り付けるとどうでしょうか?(正常であれば動画が表示されます)僕の環境では、 (URL は運営側で削除) の URL を記事に貼り付けると、正しくブログカードが表示されました。プラグインを全て停止しても NG ということでしたら、例えば海外 IP は遮断するとか、何らかの制限がサーバー側でかかっていると表示されないことはあるかもしれません。
♥ 0Who liked: No user2018年4月22日 10:14 PM #2228返信が含まれるトピック: Font Awesome 5 対応について
「若干のコード変更」は
<i class="fa〜
で指定する方法のことを指していました!描画になったので、CSS でcontent
を指定する方法についてはもう少し複雑になります。子テーマに js ファイルを追加して、下記のようなコードを足すことで実現できます。jQuery(function($) { // 本当はセレクタは .entry__content > ul > li とかが良いかも $('ul il').prepend($('<i class="fas fa-angle-right" />')); });
before を指定するわけではなく i タグを突っ込んでいるので多少 CSS で位置調整が必要かと思います。
もし js 版ではなく CSS 版をお使いになりたい場合は、子テーマの functions.php で指定して読み込ませたほうが良いかと思います(
@import
は低速になることが多いようです)。add_action( 'wp_enqueue_scripts', function() { wp_enqueue_style( 'fontawesome5', 'https://use.fontawesome.com/releases/v5.0.10/css/all.css' ); } );
ただ、Snow Monkey が js 版を読み込んでいるので、同時に CSS 版を読み込んだときにどういう不具合がおきるのかおきないのかはちょっとわかりません。なるべくは最初の js で対応する方法が推奨ではあります。
♥ 0Who liked: No user2018年4月22日 10:03 PM #2225返信が含まれるトピック: sliderの写真の大きさ(高さ)を変更したい。
.slick-list
のheight
は、.slick-slide の高さを見て自動的に設定されるようです。高さをどう変更したいかによりますが、下記のような感じでどうでしょうか?.wpaw-slider .slick-slide { max-height: 400px; }
ちなみに、ピックアップスライダー、スライダーウィジェットの高さ指定は、横幅のそれぞれ違うサイドバーやフロントページに設置しても、また、スマホでも PC でも変にならないように、結構複雑な指定になってしまっています。なので、トップページにだけ設置していてそれをカスタマイズしたい、ということなら上記のような CSS で問題ないと思いますが、サイドバーにも使っているとかであれば、もうちょっとセレクタを工夫する必要があるかもしれません。
※あと、この書き込みのおかげで明らかな CSS の記述ミスを見つけました。ありがとうございます!
♥ 0Who liked: No user2018年4月22日 9:42 PM #2221返信が含まれるトピック: パンくずリストの表示内容と表示場所について
(1)表示内容から「投稿タイトル」を除外してほしい
こちらについては、逆にあったほうが良いという方も多分いると思うので、不要な場合は CSS で消していただくのが良いかなと思います。カスタマイザーの追加 CSS か、子テーマのスタイルシートに下記を追加してみてください。
.c-breadcrumbs__item:last-child { /* display: none; */ }
(2)表示箇所をページ上部、またはページ下部で切り替えできるようにしてほしい
なるほどですね!こちらは次回アップデートで対応します!
♥ 0Who liked: No user2018年4月22日 2:35 PM #2219返信が含まれるトピック: Font Awesome 5 対応について
たびたびすみません。CSSについては’@import’でstyle.cssに読み込めばよかったですね。
すみません。基本でした。
テーマと別に別途CSSを設定しなくてもよいのであれば教えていただけますか。♥ 0Who liked: No user2018年4月21日 11:43 PM #2216返信が含まれるトピック: Font Awesome 5 対応について
CSSを挿入し忘れました。
ul li:before { /* font-family: 'FontAwesome'; */ font-family: "Font Awesome 5 Free"; content: "\f00c";/*アイコン種類*/ position: absolute; left : 0.5em; /*左端からのアイコンまで*/ /*アイコン色*/ color: #3B5998; }
♥ 0Who liked: No user2018年4月21日 11:41 PM #2215Masahiko Abe
参加者Font Awesome 5対応方法について教えてください。
アップデートの変更点で下記の記載がありましたが、「若干のコード変更」方法がよく分からず詰まっています。
> FontAwesome5 対応(アイコンフォントから、js描画に変更になります。メニュー等に追加されている方は、若干コードの変更が必要です)具体的には箇条書きの行頭文字を以下のCSSで変更していたのですが、font-familyを変更しても文字化けしてしまっています。
js描画ということで、この方法では駄目なのであろうことまでは理解したのですが、どう対応したらよいものかわからず、教えていただけると助かります。
よろしくお願いします。2018年4月19日 9:34 PM #2195返信が含まれるトピック: 投稿ページの「タグ」のこと
なんとなくデザインのおさまりがわるくて、でないようにしていたのですが、ちょこちょこ要望があるので、デフォルトででるようにするかちょっと検討中です!
とりあえず、子テーマでコードを追加することで表示するようにすることができますので、試してみてください。
記事ページタイトル下にタグの一覧を表示したいSnow Monkey の記事ページでは、タイトル下に記事のメタ情報(投稿日や投稿者、カテゴリーなど)が表示さ…snow-monkey.2inc.org
パスワードはオンラインコミュニティの総合案内をご確認ください。
♥ 0Who liked: No user2018年4月17日 1:27 PM #2165返信が含まれるトピック: ビジュアルエディターでボタンのリンクを編集しようとするとリンク先のページが表示されてしまう
TinyMCE 内の .wpaw-btn が click されたときに、リンク動作を無効にすれば解決する、と思うのですが、TinyMCE 内の要素をどうやって js で制御すれば良いのかわからず、ちょっと僕だけで解決するのは難しそうです…すみません。
とりあえず、テキスト部分をドラッグして選択すれば、リンクせずに編集できそうではありました。
もしかしたら WordPrss コアのバグとして今後解消されるかもしれませんので、しばらく様子見したいと思います。もし良さ気な解決方法を発見された場合はぜひ教えてください!
♥ 0Who liked: No user2018年4月6日 7:10 PM #2088返信が含まれるトピック: 親ページ内の子ページ一覧の位置を変えたい
順番を入れ替えるには、子テーマを使って、Snow Monkey のテンプレートを上書きする必要があります。
子テーマを用意したら、
/themes/snow-monkey/templates/view/content-page.php
を
/themes/(子テーマ)/templates/view/content-page.php
にコピーします。そして、
/themes/(子テーマ)/templates/view/content-page.php
内の<?php if ( get_option( 'mwt-display-child-pages' ) ) { get_template_part( 'template-parts/child-pages' ); } ?>
を
<?php the_content(); ?>
の上に移動させてください。
デザイン的に、多少 CSS も追加が必要かもしれませんね。♥ 0Who liked: No user2018年4月3日 3:35 PM #2070返信が含まれるトピック: テーマへのjQueryプラグインの組み込み方
子テーマの準備
Snow Monkey 自体のコードを変更してしまうとアップデート時に変更がリセットされてしまう(最新の Snow Monkey で上書きされてしまう)ため、Snow Monkey の子テーマを用意し、その子テーマの functions.php で jQuery プラグインを追加することになります。
子テーマの準備については、下記のページをご参照ください。
子テーマはいくつかの作り方がありますが、上記記事内で紹介しているオレインさんが作られた子テーマの雛形を使用するのが簡単かと思います。
jQuery プラグインの読み込み
子テーマの functions.php に次のようなコードを追加してみてください。
add_action( 'wp_enqueue_scripts', function() { // 使用する jQuery プラグインを読み込み wp_enqueue_script( // 半角英数字で任意の名前を設定 'jquery.smoothscroll', // 使用する jQuery プラグインの URL(ローカルでも CDN でも Ok) 'https://cdn.jsdelivr.net/npm/jquery.smoothscroll@1.0.2/src/jquery.smoothscroll.min.js', [ 'jquery' ], false, true ); // jQuery プラグインを実行させるコードを記述するための js ファイル wp_enqueue_script( get_stylesheet(), get_theme_file_uri( '/app.js' ), [ get_template() ], false, true ); } );
で、子テーマの直下に app.js というファイルを作成して、jQuery プラグインを実行するコードを追加してください。
wp-content/themes/snow-monkey-child/app.js
※どういうコードを書くかは使用する jQuery プラグインによって異なりますのでここでは省略します。これで動作すると思いますが、もし動かなかったらブラウザにでている JS のエラーを書き込みください!
♥ 0Who liked: No user2018年4月2日 1:28 PM #2035返信が含まれるトピック: HTMLコンポーネントのカスタマイズ
01. オリジナルコンポーネントの追加機能
HTML コンポーネント挿入機能にはフィルターフックが用意してあります。
例えば、子テーマの functions.php に次のようなコードを追加することで、オリジナルのコンポーネントを追加できます。add_filter( 'inc2734_wp_awesome_components_register_components', function( $components ) { return array_merge( $components, [ 'columns-1-2-2' => [ 'label' => 'カラム (1/2/2)', 'html' => sprintf( '<div class="wpac-columns mceNonEditable"> <div class="wpac-columns__row"> <div class="wpac-columns__col wpac-columns__col--1-1 wpac-columns__col--md-1-2"> <div class="wpac-columns__col-inner mceEditable"> %1$s </div> </div> <div class="wpac-columns__col wpac-columns__col--1-1 wpac-columns__col--md-1-2"> <div class="wpac-columns__col-inner mceEditable"> %1$s </div> </div> </div> </div>', esc_html__( 'Columns', 'inc2734-wp-awesome-components' ) ), ] ] ); } );
02. カラムコンポーネントの数値指定
そうなんです!でもこれ実装が超難しそうで、実現に至っていません…。まだ Gutenberg 対応は全くしていませんが、Gutenberg には挿入時にそのようなオプション指定ができる仕組みがあるっぽいので、Gutenberg に置き換えるときにそのような機能も追加できれば、と考えています。
03. 使わないコンポーネントを一覧で表示させない設定
こちらも、フィルターフックを使うことで消せると思います。
add_filter( 'inc2734_wp_awesome_components_register_components', function( $components ) { unset( $components['alert'] ); unset( $components['alert--warning'] ); return $components; }, 11 );
alert、alert–warning などのキーについては、
内のファイルを見てもらうとわかるかと思います!
♥ 0Who liked: No user -
投稿者検索結果
Search results of "i"
-
検索結果
-
トピック: Font Awesome 5 対応について
Font Awesome 5対応方法について教えてください。
アップデートの変更点で下記の記載がありましたが、「若干のコード変更」方法がよく分からず詰まっています。
> FontAwesome5 対応(アイコンフォントから、js描画に変更になります。メニュー等に追加されている方は、若干コードの変更が必要です)具体的には箇条書きの行頭文字を以下のCSSで変更していたのですが、font-familyを変更しても文字化けしてしまっています。
js描画ということで、この方法では駄目なのであろうことまでは理解したのですが、どう対応したらよいものかわからず、教えていただけると助かります。
よろしくお願いします。