メインコンテンツに移動

メインナビゲーション

  • ホーム
  • サイトマップ
  • ビデオ
  • ご連絡

パンくず

  • ホーム
  • DrupalのBootstrapテーマにあるハイライトエリアにjumbotronとwellクラスより表示バランスが崩れため、一時的にこのクラスをjavascriptページをロード時に削除

DrupalのBootstrapテーマにあるハイライトエリアにjumbotronとwellクラスより表示バランスが崩れため、一時的にこのクラスをjavascriptページをロード時に削除

SEO
css
drupal
javascript
SEO
Twitter
bootstrap
block
jQuery

やりたいこと:Drupalのブロックシステムにある「ハイライトされ」エリアにTwitterなどのフォローボタンを配置します

  • サイトSEO一環として、Twitter、Facebookなどのフォローボタンを設置したいです
  • 配置場所としてページのトップにある「ハイライトされ」エリアにしたいです

問題点:テーマ(Bootstrap)のjumbotron、wellクラスよりハイライトエリアの表示バランスが崩れます

  • DrupalのBootstrap(3.x)テーマに、「ハイライトされ」エリアにjumbotron, well設定で、表示のバランスが悪くなります
  • Drupalではブロック、メニューなどのラップクラス、属性追加するモジュールがありますが、特定な要素(div)にあるクラス(jumbotron, well)の削除方法はあまりないです

解決:javascriptでページロード時に特定なクラス(jumbotron, well)を削除します

  • テーマのテンプレートファイル修正、プログラミングで特定なクラス(jumbotron, well)を削除することができます
  • できればテンプレートファイルなどの変更せず、表示を変更する手法を取りたいです
  • ここで、javascriptでページロード時にこの二つのクラス(jumbotron, well)を削除します
    <script>
          jQuery(document).ready( function($){
            $("div.highlighted").removeClass( "jumbotron" );
            $("div.region-highlighted").removeClass( "well" );
          } );
    </script>
  • このスクリプトを挿入する場所としては、新しいブロックを作成するか、Twitterのフォローボタンを記述するブロックに追加すればよいです

 

ホーム

古松

検索

Article Category

  • apache(7)
  • css(19)
  • drupal(295)
  • Electron(4)
  • html(34)
  • javascript(27)
  • laravel(4)
  • linux(5)
  • macOS(2)
  • mysql(13)
  • php(19)
  • python(4)
  • SEO(12)
  • video(72)
  • Visual Studio Code(4)
  • windows(13)
  • wordpress(32)