ど素人から毛を生やす。<延>

Web

シンプルで更新が簡単なjsスライドショー

Web > javascript 2014年1月30日(最終更新:5年前)

どもです。
最近、妙に夢見の悪い餅。です。
大学4年の正月休みに資格必須の集中講義を寝過ごし逃すとか、なにこのリアル過ぎてワロエナイ夢…。

さて、今回はJavaScriptについて。

スライドショーをjsで作ることになりました。
画像が入れ替わって、それにリンクが伴っている単純なものです。

ただし、割と更新が頻繁に行われる上、更新するのはJavascriptにあまり詳しくない人です。

しかも、できるだけJavaScriptの編集だけで更新を行いたいとのこと。

それでいて、なぜかjQuery使用不可。

これは、なかなか難題かもしれぬ…

てなわけで、こんなん作りました。
ソース長ぇw

HTML

css

なwwげwwぇwww... 続きを読む »

wp_list_categoriesの色々

Web > WordPress > カテゴリー 2014年1月28日(最終更新:5年前)

どもです。
シリコン細工に失敗したので、今度は透明粘土にチャレンジ予定の餅。です。
シリコンやレジンはお高いので、もうちょっと気軽にやりたいところ。

さて、今回もWordPressで。

カテゴリリンク一覧を作るとき、お世話になるのが「wp_list_categories」ですが、これって結構色々カスタムできるらしい。

書き方としては、

という感じで、注文の数だけコマンドを&で繋げればおkです。

で、今回はよく使いそうな注文の使い方を書いていこうかと。

①「カテゴリー」の表示は要らん。

wp_list_categoriesを使うとデフォルトではリストの上に「カテゴリー」と表示されますが、ここの記述はtitle_li=で変えることが可能です。クォーテーションは不要。
ここに書かれたものはそのままHTMLに記述されるので、何もなしなら何も記載されません。ここにはタグを書くこともできます。

②このカテゴリは要らん。あと親カテゴリだけで良い。

depthはデフォ値0だと子カテゴリも孫カテゴリも表示されるので、親だけにしたいときは値を1にします。
excludeに除外したいカテゴリIDを書けば、その子孫まで除外してくれます。
あるカテゴリだけ別扱いしたいけど、カスタム投稿を作らず一元管理するときとかに便利。... 続きを読む »

CSSでフローティングウィンドウもどき

Web > css 2014年1月23日(最終更新:5年前)

どもです。
この頃、なんとなく癒しが足りない餅。です。

今回は久しぶりにCSSの話。

HTMLにはフローティングウィンドウというものがあります。
ボタンをクリックすると画面にウィンドウが出てくる奴。条件としては、ポップアップブロックなどに適用されず、動かすことが可能なものだそうで。

で、それを作るということになったものの、設置箇所がデータベースのリスト中。
その数が動的というのが困ったもので、しかもデータベース化するのは僕ではなく。
これは、普通にJavasriptで設置・管理するのは厳しいかも?。

ただ、動かせないウィンドウならCSSだけで実現可能そうだったので、そっちでやってみました。

参考にしたサイト様はこちら

HTML側の記述はこちら。

で、CSS側の記述はこちらです。

仕組みとしましては、チェックボックスにチェックが入っているときのみ、チェックボックスと隣接するdivがdispray:blockになるという単純なもの。... 続きを読む »

jQueryでカルーセル作るお

Web > javascript 2014年1月21日(最終更新:5年前)

どもです。
最近ソード・ワールド2.0の大型サプリを買い揃えてしまったので、今度はリプレイを集めようかと画策している餅。です。

今回はWordPressから離れてjQueryの話。
ところで、この記事書くにあたって僕は初めて「カルーセル」という言葉を知りました。
今までスライドショーの一種だと思っていたのでちょっと驚き。

そんでもって、今回作るのはこんな感じのもの。

h260121_1

単に作るだけなら簡単ですが、問題はこのカルーセルを載せるのがレスポンシブサイトだということ。

カルーセル本体のサイズが一定でないということは、終端がどこになるか定かでないということです。

さて、まずはHTML&CSS。
こんな感じです。

h260121_3

ulをものすごく大きな数値に設定します。
そして親要素をoverflow:hiddenにし、ulを覆います。

で、肝心のjQueryはこうなります。
以下はliの幅を170px、左右の余白を110pxとしたときです。

仕組みとしては、ボタンを押された瞬間の画面サイズを取得し、「(画面サイズ-余白)/liのサイズ」でページあたりの表示数を取得。... 続きを読む »

カスタム投稿でタグによって条件分岐したい

Web > WordPress > カスタム投稿 2014年1月20日(最終更新:5年前)

どもです。
思いつきでシリコン細工を始めてみたら、いつの間にか一日が終了していた餅。です。

さて、今回もWordPressについて。
最近WordPressしかやってぬぇ…(´・ω・`)

この前、カスタム投稿という奴を初めて操作したんですが、これがまた便利だがややこしい。

何がややこしいって、これまでなら一言で完了していた動作がすこぶる複雑なのがややこしい。

で、見事にハマってしまった件がタイトルの通り、タグ情報を取得してそれによって条件分岐するというもの。

結果論からするとこんな感じになるのですが…

注意したいのが、「タクソノミーの分類名」のところ。
ここに記述するのは、functions.phpで設定した、

この、分類名のところです。
僕はこれに気づけなくて数時間を棒に振りました(笑)
一度わかれば「当たり前なので一々注記しない」ことなのですが、わかる前だとこういうところで引っかかってしまう例ですね。

ちなみに、他の条件分岐について詳しく知りたい場合はこちら... 続きを読む »

サイトアドレス変えたら404になった件

Web > WordPress 2014年1月17日(最終更新:5年前)

どもです。
最近、めっぽう朝に弱い餅。です。

今回もWordPressの話。
WordPress積み込むときって、ディレクトリ構造は割とサーバーやユーザーの都合によってバラバラですよね。
例えば、当サイトはhttpdocs直下に展開してますが、たぶんこれはレアなケース。

一般的には、httpdocs/wp/とかこういうのが多くて、サーバーの自動インストールを使ったりすると、httpdocs/cp-bin/wp/とか更にディレクトリが増えたりする。
けど、サイトのURLとしては「ドメイン/カテゴリ/記事名」とかそういうのが好ましいですね。

そこで使うのが管理画面の「設定/一般」のこれ。

h260117

この、「サイトアドレス」の方を変更することで、サイトのURLが変わります。
くれぐれも「WordPressアドレス」の方を変えてはいけません。第三次です。大惨事です。

その後、「パーマリンク設定」から設定を保存。
で工程は終わりなのですが、これだけでは上手くいってくれないことがあります。

具体的にはサイトが404エラーになります。

前置きが長くなりましたが、今回はそういうときの対策法。

まず、サイトアドレスで指定したディレクトリの「.htaccess」を探します。... 続きを読む »