スタッフブログ

便利なjQueryをご紹介

こんにちわ。
ラクーの神谷です。

本日は、便利なjQueryの設定をご紹介します。

本来、ブロック要素は、中のコンテンツ(文章や画像等)の量によって、高さが変わります。
ですので、複数のブロックを横に並べた時に、サイズを指定しないと高さもバラバラになってしまいます。
しかし、固定値で共通の高さを指定すると、入り切らなかったコンテンツが切れてしまいます。
そんな時に、高さが高いブロックに合わせて、高さを自動で変更してくれる便利なjQueryがあります。

▼通常
a

▼設定時
b

この設定を行えば、中のコンテンツの量が増えても、
自動的に高さを調整してくれるので、別で高さを調整しなくても大丈夫です。

他にもjQueryは様々な便利な機能がございますので、
「他のサイトでこんなのを見たんだけど、できないかな?」等の、
ご要望がございましたら、お気軽にお問い合わせください。

スタッフブログ | 2017年11月17日

WordPressを使った会員登録サイトの作り方

こんにちは(^^)/
デザイナーの松田です!!

今日は「WP-Members」というプラグインをご紹介します。
プラグイン元URL:https://wordpress.org/plugins/wp-members/

このプラグインはWordpressのユーザー機能を用いるのですが、
ユーザーに登録してあるIDとパスワードを入力しないと、
そのページの中身が見れなくなるというプラグインになります。

いわゆるちょっとした会員登録サイトみたいなものですね。

image

ここに登録されているIDとパスワードを入力することで、
ページの内容を見ることができます。

image2

また、上記の「内容をブロック」から投稿と固定ページをブロックするorしないの設定をすることができます。
このプラグインのデメリットとして、特定のページのみというのができないのが難点ですね。。。
なので、サイト全体を会員サイトとして、扱いたい場合などにはオススメのプラグインになりますし、
特定のページのみにされたい場合は、ベーシック認証などを使うのも一つの手かと思います。

弊社では、「こんなことできないか?」「こんなことはできるのか?」などの質問に対して、
すぐ「NO」とは基本的には返しません。
一度、できるか試してみたり、いろいろな方法を利用して、それでも難しいそうでない限りは基本的にはどんなことでも対応させていただきます。

ちょっとでも気になったことなどがあれば、お気軽にご相談ください。

スタッフブログ | 2017年11月10日

お客様の声ページを公開いたしました

こんにちは。坂です。
準備中でした、「お客様の声」ページを先日公開いたしました。

つづきファミリー治療院様はじめ
お客様にいただいた声を随時掲載しております。

voice

 

実際にホームページを制作して、「ホームページで集客ができている」
「ホームページを見て電話をしましたというお客様がいます」
という嬉しいお言葉をいただけました。

私達ラクーはホームページを作るだけではなく
「お客様がホームページから利益をあげていただける」ことを大事にしております。
今後もお客様にホームページを制作してよかったと思っていただけるよう
努めてまいります。

現在、お客様の声は2つですが
いただいた声をまとめ次第随時公開したり、
他にも新しい情報をどんどん掲載してまいりますので
是非ホームページをチェックしてくださいね。

スタッフブログ | 2017年11月02日

2つの「色の三原色」

こんにちは、朝日です。
皆さんは「色の三原色」と聞かれると、どんな3色を思い浮かべますか?
色の三原色には2種類あり、「光の三原色(RGB)」と「色材の三原色(CMY)」があるのです。
2つの違いはなんでしょうか。

「光の三原色」

光の三原色は、
R…赤
G…緑
B…青
の3色です。
光の三原色、というだけのことはあり、色を重ねていくとどんどん明るくなっていきます。
科学館にある3色のライトを壁に当て3つの色が重なるところは白くなるアレを思い浮かべてもらえるとわかりやすいでしょうか。
テレビやパソコンのディスプレイはRGBの3色で表現されています。

「色材の三原色」

色材の三原色は、
C…シアン
M…マゼンタ
Y…イエロー
の3色です。
絵の具のように、色を重ねていくとどんどん暗くなっていきます。
ただこの3色を混ぜただけでは、黒色にはならないため
印刷ではこの3色に K…黒 を加えた4色で表現します。

表現できる色の範囲

RGBはCMYKに比べると、色の表現できる範囲が広くなっています。
そのため、RGBでは表現できた色がCMYKでは表現できない場合があるのです。
表現できない色はCMYKで表現できる近似色に置き換えられてしまいます。

RGB形式の写真をCMYK形式に変換してみましょう。

002
RGB

002_
CMYK

RGBの画像に比べて、CMYKの画像がくすんだような色味になっているのがわかるでしょうか?

変換をすると、色味が変わってしまうのは避けることができません。
なので、印刷物等のデータは予めCMYKで作成する必要があるのですね。
最近ではRGBのままのデータでも再現度の高い印刷を行ってくれる印刷会社さんもあるようですから、
表現の差がほとんど無くなる日が来るかもしれません。

弊社ではチラシ・パンフレットなどの印刷物の制作も承っております。
制作をご検討のお客様はぜひお問い合わせください。

スタッフブログ | 2017年10月27日

写真の加工について

こんちにわ。神谷です。
本日はスマートフォンの便利なアプリを紹介したいと思います。

スマートフォンで写真を撮って会社のブログやSNSに投稿したいけど
写真が上手く撮れなくて、載せられないなんてことはありませんでしょうか?

そんな時にPhotoshopなどの高度なソフトを使わなくても、
スマートフォンで簡単に画像を綺麗に修正できるアプリがあります。
明るさを調整したり、色合いを変更することができます。
それだけでなく、画像に文字を入れたり、対象物の周りをぼかして対象物を目立たせるということも簡単にできます。

before

after

今回は「LINE Camera」というアプリを使いましたが、他にも様々なアプリがでていますので
専門的の知識がなくても、スマートフォンさえあれば写真を綺麗に加工することができます。

「会社のブログやSNSを更新したいけど、知識がなくてできない。」など
ホームページのことでお困りごとがございましたら、弊社までお気軽にお問合せください。

スタッフブログ | 2017年10月20日

最近見つけたおしゃれなプラグイン

こんにちは(^^)/
デザイナーの松田です!!

名古屋は今日から1週間近く雨みたいですね…
秋は季節の変わり目なので、風邪もひきやすいですし、
みなさん体調管理は十分お気を付けください!
かくいう自分も先週風邪引きました…

さて、今日は最近見つけた「Sweetalert」というプラグインをご紹介します!
とはいっても「Wordpressの」プラグインではないので、
htmlやECサイトなどでも使えるのではないかと!!!

Sweet alertとは?

名前からして甘そうなアラートですね。。。
アラート機能といえば!!

a5d17b09363b4244bec2956fdbaec092-620x229

これですよね?
画面の上部によく出てきては、これが消えないと何もできないという
お知らせしたい際にはよく使用されるjavascriptになります。
これをもっとおしゃれにかわいげのあるものにできないかというお話があり、
運よく見つけられたのがこの「Sweetalert」です!!

株式会社フルハシ

設定方法は?

例えば、上記のようにリンク先はあるけれど、中身ができていなくて、
準備中にしておきたい。。。などの際に活用できます。

下記のような感じで、クラス名を設定し、
言葉も変更することが出来ます!!

$(function(){
document.querySelector(‘.under_construction1′).onclick = function(){
swal(“現在準備中です。”, “今しばらくお待ちください。”, “error”);
};
});

CSSを変更することで、背景や文字の大きさなども変更できますので、
融通の利きやすいアラートとも言えますね!!(^^♪

javascriptとcssさえあれば、設定できますので、
ぜひ一度お試しください!!

スタッフブログ | 2017年10月13日

ホームページの文字について

こんにちは 坂です。
今回は、ホームページで使用されている文字について少しご紹介いたします。


弊社ラクーのホームページ、TOPにあるこの文章は
文章を読みやすくする、且つ強調するために、font-familyという設定を変更しています。

変更前はこちら↓

なんか、ギザギザしていていかにもパソコンの文字という感じがしてしまいます。。。

ホームページで使用されているフォントは「MS P ゴシック」がデフォルトになっていて
文字のサイズを大きく設定をすれば、まだこのギザギザした感じが少ないのですが
このくらいの小さな文字ですと少し読みにくくなってしまいます。

画像で小さな文字でも綺麗なフォントを選んで制作をしても良いのですが
テキストとして書かれていたほうが、
キーワードとして検索対象になるので検索対策にも有利です。

テキストで綺麗な文字にしたい。そんな時は

ホームページのデザインを作り上げるCSSデータの
font-familyに「ヒラギノ角ゴ」「メイリオ」など小さな文字でも綺麗なものを指定します。
ただ、パソコンにこれらのフォントが入っていない可能性もあるので、
一応、MSPゴシックも記載しておきます。


このfont-family、明朝体にもできます!
和風なサイトであったり、綺麗めのサイトの場合など
デザインにあわせて、変更するのも良いかもしれません。

実装されたいなどのご相談は弊社までお気軽にお問合せください。

スタッフブログ | 2017年10月06日

WordPress機能のご紹介-投稿順を操作する-

こんにちは、朝日です。

朝夜すっかり涼しくなり、少し寒いくらいになってきました。
どちらかと言うと暑がりな私、出退勤時と勤務中の体感温度の差にすこしばかりげんなりします。
昼間はとても暑い…

さて、たまには違う題材に…と考えていたのですが、今回もプラグインです。

投稿日順が当たり前?

このスタッフブログも含めて通常のブログ記事は投稿日の新しいものから並んでいますよね。
最新の情報はTOPページでも一覧ページでも目につく最初に置きたい。
でも、普段の情報とは少し違う「特別な情報」を掲載することも有るでしょう。
例えば、長期休暇のお知らせ、営業時間の変更、キャンペーンの告知…
何週間も前からお知らせを掲載して、少しでも多くの人に知ってほしい情報があっても、日々の記事更新で気づけば一覧の外へ行ってしまっていた、、、なんてこともあるかもしれません。

そんな時、一つの方法としては、Wordpressに元からある機能「先頭固定」を使いましょう!
記事の編集画面の公開枠の[公開状態]を編集すると、
新規投稿を追加 ‹ HPラクー — WordPress
□ この投稿を先頭に固定表示
こちらにチェックをつけて更新をすると、投稿日にかかわらず一番先頭に表示してくれるのです。

先頭固定は使いすぎると普段の更新が埋もれてしまうので、ここぞという時にお使い頂きたいのですが、
こちらの設定は複数の記事を指定することもできます。
その場合は、先頭固定の記事から新しい順になるようですね。
先頭固定の記事の中でも一番にしたいものがあったら、さすがにこの機能では難しいです。

そんなときには、こちらのプラグインが有効です。

使用したプラグイン:Post Types Order

設定はインストールのみ☆簡単です

インストールが完了すると、
01
いつもの投稿一覧のカーソルがクロスカーソルに
02
そして、記事をドラッグすると
03
うごきます(^^)
あとは好きな位置に移動しちゃいましょう。

いかがでしょうか。
ここぞという記事は上へ、上へ…
しかし、あまりいじりすぎるとバラバラになってしまいますので、程々に使用いただければと思います。

実装のご相談は弊社までお問合せくださいませ。

スタッフブログ | 2017年09月29日

レスポンシブデザイン(スマートフォン表示)

こんにちわ。神谷です。

本日は「レスポンシブデザイン」に関して、ご紹介します。
「レスポンシブデザイン」とは見る端末によって、デザインを変更することを指します。

パソコン用のデザインをそのままスマートフォンなどの画面の小さい端末で見ると、
画像などのコンテンツがその分小さく表示され、見にくくなってしまいます。

最近では当社のホームページもスマートフォンでのアクセスがかなり増えております。
ホームページ見る時に見たいコンテンツがすぐ見つけられないとストレスを感じませんか?
当社でも見て頂く方に快適にご覧頂くために、スマートフォンでの表示に合わせてデザインを変更しております。

※PC表示

pc_download

※スマートフォン表示

名称未設定-1

サイトメニューをクリックすると表示されるように変更したり、
「コース別料金表」という横並びに並んでる項目を縦並びに変更して画面いっぱいに表示させたりと、
見る端末に合わせてデザインを変更することで、コンテンツをすぐ見つけることができるので
スマートフォンからのアクセスであってもストレス無く、ホームページを見ることができます。

実装のご依頼、少しでも気になったことがございましたら
弊社までお気軽にご相談ください。

スタッフブログ | 2017年09月22日

ボタン一つで簡単に電話できる!?案外入っていない電話のリンク…

こんにちは(*‘∀‘)
デザイナーの松田です!

今日は朝から北朝鮮がミサイル飛ばしたり
うるさい一日でしたね…(-_-;)

お盆も終わり、学生さんたちも夏休みが終わったのもあるからか
今月に入ってから、お客様からのお問い合わせの電話が急増しました。

最近はホームページも凝ったデザインが本当に増えてきました。
スマートフォンで見た際に、電話番号をテキストで入力していると、
自動的にその電話番号を押すだけで、すぐ電話できる「TELリンク」と
呼ばれるものがついてくれるのですが、その部分を画像で作っていたりしていると、
そうはいきません。。。

名称未設定-4

上記の画像は弊社のサイトの一番上の部分にあるお問い合わせのフリーダイヤルです!
(お問い合わせ待ってます!!!!)
この画像に対して以下のように設定するだけです。

名称未設定-9

こうするだけで画像にもTELリンクを貼ることができます!
意外と知られていない、やられていないところが多いんですよねこれ…(´・ω・`)

みなさん一度お試しください!

スタッフブログ | 2017年09月15日

ホームページ運用相談作成依頼はこちらから

0120-982-419

メールマガジン会員募集

ラクーからのメールマガジンの会員を募集しております。
ホームページに関する最新情報や、IT業界の先進事例などを定期的に送信いたします。
ご登録は下記のフォームにメールアドレスを入力して送信するだけとなります。


PAGE TOP