tsukalogo0000


alt

Content Templater(h5斜線で囲んだタイトル)

h3タイトルサンプル

h3タイトルサンプル

h3タイトルサンプル

フェードインして画像が出る(jsモジュールが機能するページのみ) 本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル本文サンプル。左画像は左寄せで右マージン設定の画像。
このモジュールは、記事のテンプレートを登録しておいて、常時編集画面から呼び出して使える便利なエクステンションです。ノーマルのデザインに新規記事のボタンを押したら既に出てくる様に設定しておき、追加オプションでモジュールのタグや、画像、テーブル等の特殊なタグを付加して呼び込める便利ツールです。各ページ出来るだけ色んな見せ方を試みていただけにこういうエクステンデョン探してました。よってこのページはノーマルの記事テンプレートのContent Templaterデモページとなっております。

 


※下記はポップアップの写真用タグ

●タグを書き込む種分け=xml、css、php、javascript
href="http://www.tsuka-time.com/ball1.gif"type="image/gif"/>

joomla!の道しるべ→http://www.joomlaway.net/extension-new/style-a-design/articles-styling/947-content-templater-.html

アイコン画像集

 

alt

jQueryで画像をフェードイン

いままで、フェードインって意識した事なかったけど、意外と使い方次第かな? と… Appleの公式ホームページは大きい画像にふんだんに使われている。 jqueryとしては、初歩的なもんだが、 例えば、画像スライド系の大きな仕掛けのスクリプトとが動いる場合、結構画像を読 む時に画像がだらしなく範囲外へ露出してしまう事がある。 そんな時これを実装すれば、読み込む際に画像が消えた状態なのできれいに演出できる。 head内でも記事内でもモジュールでもスクリプトが消されてしまわないならどこでもいい
サンプルページhttp://tsukapiko.minibird.jp/index.php/logout.html

<script type="text/javascript">
    jQuery(document).ready(function() {
    jQuery('#fadein').fadeIn(2000);
    });
</script>

例の如く、joomlaでは、$はjqueryに置きかえる。 CSSは、事前に消して置かないと、フェードインできないので消しておく。ちなみに(2000)はフェードインに要する時間で、("slow")の場合””が必要で約1000レベルと同等の値となる。 htmlには下記を記す

<div id="fadein"></div>

cssには以下の様に要素を消しておいてjQueryでフェードイン。 ちまたでは事前に消しておくという指示を忘れている場合が多いようだ

/* 画像のフェードイン */
#fadein{
display:none;
}

テストを兼ねているのでスクリプトは、画像を入れたモジュールに直接書き込んでる。

 

alt

ブログカテゴリ記事の設定

メニューを作る時にそのセクション>カテゴリ>記事がどのように掲載されるのかを決定する為に、そのスタイルの種類が出て来ます。一般的には単体のスタンダード記事やブログに限らず今後記事を増やしていく場合のページ立てとして“ブログカテゴリ記事”というものがあり、適当に思いついた内容を増やしていけます。私の場合メニューに画像がふってありページによって無数にメニューがあるので、その数だけ無数にIDが生成されて(殆どコピーで作ったので連動したものが多い)どのページがどのメニューで設定したか管理ができていない。


ブログカテゴリのパラメータ設定で表示される内容を決定します。尚パラメータ・コンポーネントでは更新時期や作成日時、又は評価なども設定できます。省く事が多いので記事管理の全体パラメータで一括設定が煩わしくなくいいでしょう。

 

alt

使用モジュール

joomla!1.522標準装備モジュール

アーカイブ済みコンテンツ mod_archive アーカイブされたコンテンツを年月ごとに一覧表示します。
オンラインユーザ mod_whosonline 現在サイトにアクセスしているユーザ(ゲスト)と登録(ログイン中)ユーザを表示します。
カスタムHTML mod_custome WYSIWYGエディタを利用してHTMLを入力できます。
セクション mod_sections セクションの一覧を表示します。
ニュースフラッシュ mod_newsflash 指定したカテゴリのコンテンツをランダムに表示します。
バナー mod_banners バナーコンポーネントで設定したバナーを表示します。
パンくず mod_breadcrumbs パンくずリストを表示します。
フィード mod_rssfeed RSSアイコンを表示します。RSSで配信できるのはトップページのコンテンツのみです。
フィード表示 mod_feed 登録した外部サイトのRSSを表示します。
フッター mod_footer Joomla!のコピーライト情報を表示します。
メニュー mod_mainmenu 各種メニューを表示します。初期状態ではメインメニューしかありません。
ラッパー mod_wrapper インラインフレームを使用し、外部サイトを任意の場所に表示します。
ランダムイメージ mod_random_image 指定したディレクトリに保存されている画像をランダム表示します。
ログイン mod_login 登録ユーザへのログイン画面を表示します。
投票 mod_poll 投票コンポーネントで設定した投票モジュールを表示します。
最も読まれたコンテンツ mod_mostread アクセスが多いコンテンツをリストで表示します。

使用モジュール

◆ランダムモジュール(標準)
画像がクリックするたびに変化するモジュール当サイトの左下に設置

フィード配信(標準)
フィード配信できるモジュール

◆Google Analytics Tracking Module
グーグルアナリティクスをモジュールで設置Analytics _uacct code番号を入力するだけ(参考)

◆アクセス解析 Mogura PlusX
サイトのアクセス数やオンライン数を表示。設置がやや困難

◆Random Image Plus
ランダムイメージに付加機能をプラス

◆Joomla 1.5 HTML Module
◆HTML Module
jsからCSSやphpまで書き込めて任意のページに設置出来る。

◆yvcomment
joomla!のblog記事にはコメント入力機能はない為、このモジュールを使う

◆Phoca Download Section Menu Module
コメント認証画像

◆WebLink
リンクのオートメーション化させるモジュール。紹介するサイトのトップ画面もサムネイル化(参考)

◆aidanews
新着記事を表示させるモジュール。複雑なのでやや設定に時間がかかる。(参考)

◆Top Drop Down Menu
メニューをクリックするとドロップダウンするメニュー。

◆Superfish Menu
かなり複雑なドロップダウンを達成するメニュー。モジュールでCSSを書き込める。(参考)


使用プラグイン

◆エディタ - No Editor(標準)
禁止タグも書き込める編集モード

◆エディタ - TinyMCE(標準)
一般的なスタイルと上級モードの2種類に切り替わる

◆エディタ - XStandard Lite 2.0

◆Editor - JCE
かなり普及している使いやすい編集プラグイン

◆System - JCE MediaBox
画像庫として使うプラグイン

◆Content - OzioGallery
扱う画像を様々な表現でみせるプラグイン。記事から選択させる

◆yvcomment
joomla!のblog記事にはコメント入力機能はない為、このモジュールを使う

◆yvCommentLanguagePack_pt-BR

◆mavik Thumbnails
単純な画像ポップアップ機能。バックエンドでも使用する必須アイテムとなります。(参考)

◆System - contentstatic
joomla!のアクセスを高速化させるプラグイン。その実サーバーに静的なページを作る仕掛け。

◆wrapper(標準)
joomla!に標準装備されるインフレームさせるプラグイン。(参考)


使用コンポーネント

◆CK Forms
お問い合わせ系のコンポーネント、その他さらに簡単なjFormも存在しそちらは認証もできる。(参考)

◆JCE Administration
JCEの統合コントロールとして機能する。エディション機能や画像プレビューなど

◆Ozio Gallery 2
ozioギャラリーのコントーローる部分

◆Webリンク管理
自動リンク生成モジュールをここで管理(参考)

◆Xmap
サイトマップを管理するコンポーネント(参考)

◆List of Comments
もらったコメント等を管理するコンポーネント

◆Contents Templater
あらかじめ記事編集の為のひな形を登録し呼び出すコンポーネント(参考)


使用javascript-jquery-1.3.2.min.js / jquery-1.4.2.min.js

◆dock jquery.jqDock.min.js
マックのアイコンっぽく流れながらクリック時に大きくなる(参考1)(参考2)(参考3)

◆jquery.tipsy.js
クリックすると吹き出しで文字が補助的に出て来るスクリプト(参考)

◆.jparallax.js
マウスに応じて画像が動くギミックスクリプト。(参考)

◆accordion.js
アコーディオン効果は、インパクトはありますがページの中に必要かは考えさせられます。(参考1)(参考2)

◆imagecube.js
キューブ型でくるくる画像が入れ替わりながら回るロゴタイプ 。(参考1)(参考2)

◆スライダー集
●タイトルを押すと下にリンクバナーがスライドする。(参考)

●メインビジュアル用スライダー(参考)

◆ライトボックス集
●jQueryライトBOX系仕様(参考)

●jQueryのColorBox仕様(参考)

最終更新 2012年 2月 19日(日曜日) 10:35
 

alt

静的、動的について

  • サーチエンジンフレンドリーを“はい”でエイリアス表記ののスッキリしたアドレスになる
  • rewriteを利用すると/index.php/がアドレスから取れる(※1)
  • サフィックスをurlに追加でさらに末尾に.htmlが付いた静的サイトのアドレスとなる

PC的には、CMSの場合忠実な動的アドレスが本来は正しくGoogle検索ロボも混乱するので あえて変えないでと言ってる。つまりSEO的にも弊害ではないということらしい。あとは見栄えと下層のアドレスを人に伝える場合弊害となること。


当たり前だが、記事を書く場合エイリアスがアドレスになるので同じカテゴリー はもちろん独自の名前(英文字半角)をつけでいないとマズイ!特にメニューレベルで他のエイリアスもしくはアドレスがぶつかってると上記画像の様なメッセージが出る。但し記事単体レベルだと、数字でアドレスが振られる為、ぶつかる事はない。(自分が試行錯誤したのはどうやらメニュー設定でエイリアス名が、もともと付録で入っていたメニュー名と重複していたみたいだ???)

実際作業しながら思ったことは、サイトのリンクのチェックやメニューを画像にしてカスタムHTMLで加工している 場合などベースとなるメニューモジュールから生成された動的アドレスが頼りと なる!
複雑になればなるほど、静的なアドレスにしていては辿れなくなり検証も出来な いから悩ましい。
特に制作段階でのメニューの追加、はヤバイみたいでSEO設定をONにしていると必 ずリンク切れ。他のページは問題ないのでよけい探りにくい。

それに、もし外部に下層ページのアドレスを張るケースがあれば迷わず動的アドレ スにしていた方が間違いないだろう。

(※1)それと現在リライトモジュール(index.phpが入る)は切っていない と新規記事投稿の際、画像やリンクが引っ張ってこれなくなってた。この部分については、サーバーの特性によるものとhtaceseの指示の書き方が原因だろう。おそらくindex.phpが取れる事でルートが違ってリンク切れになる???一応下記に基本的な対処法を記入

●SEFをONにする場合通常htaccessファイルを少し編集します。
50~60行目あたりにある# RewriteBase /
この先頭の#をはずしてアップしなおすらしいApache mod_rewriteを利用・サフィックスをURLに追加も一緒に「はい」にしていないと上手く行かないらしい。minibirdでは、そのままで基本設定のSEF(サーチエンジンフレンドリー)の項目を「はい」にすると、アクセスできるようです。但しApache mod_rewriteを利用にするとリンクが上手くいかなくなってしまった。今後の課題だ。果たして、ここまでして静的に変える意味があるのか?またどこかのページでリ ンクされていないのでは?やはりCMSなんでブログまがいに記事やカテゴリーを増 やしていきたいので少し動的アドレスで様子見です。
《参考サイト》
http://ms2.seesaa.net/article/168747804.html
http://joomlaism.net/m-joomla-guide/category-all-joomla-version/19-url.html
http://gwkanon.hiroba.de/index.php
http://jmemo.hiroba.de/joomla/tip/10-tips/1-jooseo.html

私のphpの知識力の問題なのか?joomlaやCMSの構成や作り方の問題なんか?そも そもどーでもいい話なのか??確かに静的に変えられてたら一目置かれるかも (爆)

 
<< 最初 < 1 2 3 4 > 最後 >>
3 / 4 ページ