• baserCMS

    body idにcontentsNameを出力

    2013/01/07

    jQueryでArchiveページのbody IDを統一したい!

    baserCMS.png

    bodyのIDにコンテンツ名を出力して、各ページでCSSを切り替えようと

     

    dafalt.phpのbodyタグに以下を記入

    
    <body id="<?php echo $bcBaser->getContentsName(true) ?>">
    
    

    これでコンテンツ名がIDに出力されます。

    ()内の引数のデフォルトはfalseで、この場合コンテンツ名のみが出力され、

    trueにした場合詳細までが出力されます。

    (例)false・・・<body id="Study">

    この記事のブログ名は"Study"に設定しているので、

    
    <body id="Study~~~">
    
    

    みたいに詳細までが出ます。(キャメルケースで出力されます)

    アーカイブページの場合は下記のように出力されるので

    01.png

    
    <body id="StudyArchives">
    
    

    body IDを使ってアーカイブ用のcssを記述しました。

    
    #StudyArchives .xxx{
      hogehoge: piyopiyo;
    }
    
    

     

    はい!完成ー!\(^o^)/

    と表示チェックしていたら。

    あれま!cssが適用されていないアーカイブページが!
     

    これですこれ。
    ウィジェットの「月別アーカイブ一覧」(;д;)

    このサイトの場合サイドバーに表示させてる月別アーカイブですね!

    03.png
     

    例えば10月のアーカイブページの場合

    02.png

    
    <body id="StudyArchives10">
    
    

    こうなっていました。
    月の数字がつくみたい!
     

    私はアーカイブページは統一して同じスタイルにしたかったので、

    月別にかかわらず、アーカイブページは全部 #StudyArchives にしたい!

    と、いうことで

    コンテンツ名の後ろについている数字を抜き去るべーく!!


    jQueryでやっちゃおー!( ・ิω・ิ)

    
    $(function(){
      var idName = $('body').attr('id'); //bodyのIDを取得
      var unityId = (idName).replace(/[0-9]/g,""); //IDから数字を抜き去る
      $("body").attr("id",unityId); //数字をとったIDをbodyのIDに設定
    });
    
    

    正規表現 /[0-9]/ で数字にマッチ。

    修飾子gで繰り返しマッチさせる。


    これでアーカイブページのIDがStudyArchivesに統一された!

    わーい\(^o^)/
     

    解決はしたけど。。

    この書き方でいいのかなー(・ัω・ั)ふむ。

    baserCMSもjQueryも、まだまだ勉強が必要デスネ!

     

    ===追記(1/15)===

    わざわざjQueryで抜かなくても、出力する時点で数字を抜いてしまう記述。

    こっちの方がいいですね、間違いなく!

    
    <body id="<?php echo preg_replace('/[0-9]+$/', '', $bcBaser->getContentsName(true)); ?>">
    
    

     

    ということで、もっとPHPを勉強せねば・・・!!

    タグ:jQuery , baserCMS

この記事へのコメント

≫ ごまふ
いいね!
kanapple
ごまふさん
初コメント!いいね!

コメントを送る

  ※ メールは公開されません
Loading...
 画像の文字を入力してください

back