Web制作LAB一覧

2014.08.29

レスポンシブWebデザインでも使える、1枚の画像でborderを使って4つ角にピッタリの背景に枠をつける方法

4つ角にピッタリの背景に枠をつける方法

レスポンシブWebデザインを使用した際、背景を各端末にピッタリ合わせる為に各端末サイズの背景を用意する事があります。ですがborderを使う事で1枚の画像で各端末の背景をピッタリ合わせる事が出来たら更新なんかも間違いなく安心して出来ますね。では枠を使った背景画像を各端末毎にピッタリ合わせちゃいましょう。

2014.08.28

オープンCMS「concrete5」を使う為の設置準備方法

オープンCMS「concrete5」を使う為の設置準備方法

concrete5(コンクリート5)はウェブ上で簡単にサイトデザインを構築できるCMSです。まだ使った事はないのですが、どんな感じでサイトが構築できるのか使ってみたいと思います。

2014.08.27

WordPressのURLに入る「category」を取るプラグイン「WP No Category Base」

WP No Category Base

通常WordPressでカテゴリーを作った時、URLに「category」というフォルダが入ってしまいます。これって普通に考えたら不要ですよね。何の為に入るんでしょうか。無駄な階層表示かと。と思った方。プラグイン「WP No Category Base」を使って表示から消しちゃいましょう。

2014.08.22

WordPressでカテゴリー毎のアーカイブ一覧を表示する方法

アーカイブ一覧を表示

WordPressではIDの割り振りで各カテゴリー毎にレイアウトやデザインを変更する事ができます。ですが、アーカイブ一覧(2014年○月みたいな一覧)をデフォルトで振り分けるのは出来ません。はてはて困りますね。ではプラグイン「wp_get_archives」を使ってカテゴリーページ毎にアーカイブ一覧を表示しちゃいましょう。

2014.08.20

Wordpressで改行がうまくいかない場合にはプラグイン「brBrbr」を入れる

Wordpressで改行がうまくいかない場合にはプラグイン「brBrbr」を入れる

WordPressのエディタで行をどれだけ改行しても、表示上は改行されていない事がります。なしてだ。。。改行して1列、2列空ける事なんて想定内だと思うのですが、WordPressは残念、そうなっていません。そんな場合はプラグイン「brBrbr」を入れて解決しちゃいましょう。

2014.08.17

CSSで背景画像を100%で表示する方法をまとめました

CSSで背景画像を100%で表示する方法をまとめました

背景画像を使用する際方法は色々とありますね。レスポンシブWebデザインを使用した際は背景画像を使う事も多いと思います。今回は同じ背景画像を使った場合に幅一杯に背景を設置する方法をご紹介します。

2014.08.12

背景をrgbaで設定した時にIE8以下で透過する方法

rgbaとfileter

背景をrgbaで設定すると透過しやすいです。でもIE8以下だと透過せず背景色が無くなって表示されてしまいます。ではIE8以下でrgbaを使って背景を透過するにはどうしたら良いのでしょうか。設定方法をまとめてみました。

2014.06.24

Adobe Acrobatを使わずにWindowsで複数のpdfファイルを1つに統合する方法

pdf

提案書をファイル毎にバラバラで作った後、pdfファイルを統合するのってどうやっていますか。Adobe Acrobatを持っていれば問題ないのですが、私はmacのプレビューを使って統合していました。制作はwindowsで、繋ぎはmacでとやっていたのでとってもめんどくさい。Adobe Acrobatを使わずにwindowsでpdfファイルを統合できるフリーソフト「pdfpdfpdf.com」を使う事にしました。

2014.06.20

GoogleMaps APIでズームのコントローラーの表示がズレておかしくなった時の対処法

GoogleMapsAPI

GoogleMapsAPIを使った時にズームしたりコントローラーが崩れておかしい表示になってしまう時があります。html内にGoogleMapsのみ表示させた場合は問題なく表示されているのですが、WebページでGoogleMapsのみなんてレイアウトはほぼありません。色々ページを組んでいった時に見られる現象です。多分、CSSとか悪さをしてるんじゃないかなぁと思っていますが、原因はよく解りません。あぁ~どうしようと思っていたのですが、CSSの追記で解決できます。

2014.06.19

背景画像CSSで設定する時に縦横真ん中に設定する方法

背景を真ん中にする

少し前、CSSを背景で設置する時に縦横真ん中に揃える事がありました。今まで考えずに設定していたのですが、その時はあれ?縦の真ん中って・・・?とふと考えた事がありました。特別難しい事はないのですが、ちょっとややこしいので記載しておきます。