サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
アメリカ大統領選
hakase-labo.com
みなさんこんばんは。ハカセ（イクメン）です。 すっかり更新をサボっていてGoogle先生からも見放されている感じの当サイトですが、たまに更新してみます。楽天市場に出店していると、楽天RMSへの不満は色々出て来るものですが、その中でも「デザインがダサい」ってのは良く聞く話です。デザインは色々変えられるものの、専門の知識が必要とされる場合が多く、中々大変だったりします。今日はその中でも最終的な転換率（購入に至る率）に影響を与えるかも知れない「お買い物かごに入れる」ボタンのカスタマイズ方法を簡単に説明してみます。結構重要。CTAボタンの色・形・テキスト「お買い物かごに入れるボタン」は専門用語で言うとCTA（Call To Action）ボタンなどと呼ばれ、古くからネットの世界では需要だと言われています。それなのに楽天市場の「お買い物かごに入れるボタン」は味気なく古臭い感じのままです。CTAボタン
「バナー作ってますか？バナー。」 バナー、バナーってネットショップ運営しているとよく言いますが、そもそもバナーってなんだよ？ バナー｜wikipedia バナー (banner) はウェブページ上で他のウェブサイトを紹介する役割をもつ画像（アイコンの一種）のこと。主に広告・宣伝用に作られ、ウェブサイトへのハイパーリンク用にも利用される。画像にはリンクを張り、クリックするとそのバナーが紹介するサイトを表示するようになっている。 横長帯状のものが一般的だが、近年は縦長のものや正方形に近いものも多い。 英語の banner は旗の種類で、本来は正方形の紋章旗だが、広く横断幕や幟などの意味に広がり、帯状の広告画像が宣伝用の垂れ幕を連想させることからこの名がついたとされ、英語では本来のバナーと区別するためにウェブバナーと呼ばれる事もある。 日本では、基本的に「軍旗」「幟」「横断幕」をバナーとは呼ばな
楽天ってセール多いですよね。スーパーSALE。お買い物マラソン。お買い物駅伝。優勝セール。6時間タイムセール。などなど、数えきれない程のセールが行われています。「嘘の2重価格」で問題になったりしましたが、リアルの店舗・ネットショップ問わず、セールは今も昔も有効な販促手段であることは間違いない様です。「今、この時間しかその値段で買えない」と言う事実は、「今買う理由」につながり、よく検討した人も勢いで買ってしまう人も、タイムセールと言う言葉は大好きなはず。セールを頻発すると、自分の首を締める事に？ただ、人は一度安い価格を見てしまうと、それ以上の価格では買う気になれません。人は「得をしたい気持ち」より「損をしたくない」気持ちのほうが強いものだそうです。主力商品を値下げすると、お客様が「セール待ち」状態になり、通常の価格で販売していても「あの時○○円だったから、今はそれより○○円高い」ってなってし
なんだか最近楽天のショップで良く目にするこれ。（このページの右下にもあります）名前は良く分かりませんが、タブみたいな形でページの端っこに固定されていて、スクロールしても隠れる事無くずっとそこにあります。今回はコレの作り方を解説してみます。もちろんコピペでいけちゃいます。若干邪魔な気もしますが、これならどんな時にも表示されていますので「目に入る」事は間違いないはずですので、ここぞと言う時にイチオシの商品などのバナーとして使えば、店舗全体のアクセスをかなりの割合でそのページに導けるかも知れません。 しかし、何事もやり過ぎは厳禁です。イチオシバナーが10個もあると結局どれがイチオシなのかお客様は分かりません。「これも売りたい」「あれも売りたい」「こっちだって売りたい」などと、売り手のエゴだけが先行すると、バナーがどんどんでっかくなっていったり、アニメーションgifのバナーがめちゃくちゃチカチカし
こんにちはハカセです。楽天やYahoo!のみならず、自社サイトでのネットショップ運営において、無くてはならないと言っていいほどに重要なものの一つが「写真」でございます。前職でも売上げを伸ばせた要因の一つに写真の力があると思っています。楽天の三木谷社長もその力を判っていたからこそpinterestに出資したのだと思います。その後なんかアレな感じで音沙汰ないですが・・・。ネットショップでは写真が無いと商品が何なのか全くと言っていいほどわからない事すらあります。特に食品やファッションなんかのジャンルでは重要です。例）結構大きめでかまぼこみたいな形のカッコイイかばんポイント10倍！カバンだって事は理解出来ますし、大きめなのはわかりますが、それ以外の情報はかなり曖昧です。これじゃあ欲しいと思うどころか、何なのかを理解する前にページを見るのを辞めてしまいそうです。 じゃあ誰もが知っている様な商品なら写
以前からMacでもWindowsでも使えるアウトラインプロセッサ（アウトラインエディタ）を探していまして、OlivineEditorというMac・Windows・Linuxで使えるアウトラインプロセッサが神アプリかも知れない件。 って記事でも書いていますが、OPMLって形式に対応しているものがなかなか無かったんですよ。 その点「OlivineEditor」は結構良い線行ってたんですが、操作性がイマイチで（個人の感想です）ほとんど使わなくなってしまい、主にMacではtreeを使ってWindowsではアイデアツリーを使っていました。 「tree」横に伸びるアウトラインプロセッサ。【Mac用】 アイデアツリー【Windows用】 両方とも良いソフトで機能も豊富なんですが、ショートカットが違うし、ファイルのやり取りも結構面倒だったのを我慢して使ってました。ちなみに「tree」はインターフェイス
こんばんはハカセです。 需要があるのか無いのかよく分からないものを提供する、でお馴染みの「ハカセの研究室」。今回はCSSのクラスを指定するだけで会話形式のコンテンツが出来る、吹き出し付きのCSSを作ってみました。 暑いのでお酒を飲みながらコードを書いていますので、おかしな所があるかもしれませんがどうかご容赦を。親しみやすいコンテンツを作る時にきっと役に立つはずです。好きな様にカスタマイズしてお使い下さい。 CSSのクラスを指定するだけでお手軽に実現可能！ 会話形式のブログってあんまり見ないな。 多分更新が面倒なんじゃないですかね。 たまにあってもtableとか画像になってたりするよな。 そうですね。 そんなのこまめに更新するなんて、発狂しそうだな。 それ用のCSS用意したら良いんじゃないですか？ お！そうしよう！ 早速コピペだ！会話形式の吹き出し付きCSSS ソースはこんな感じでdivに
楽天RMSのトップページが変わりました。主要メニューがファーストビューで見える様になったり、デザインが今風に変わったりと一見大きく変わった様に見えますが、機能的にはあまり変わってないので、正直「ふーん」って感じです。 既に担当ECCからのお知らせなどで、結局ごちゃごちゃしたトップページになっている状況も見受けられるので、実質的な効果はそんなに無いんじゃないかと感じています。楽天の好きな「見た目から入る」「流行もの好き」「質よりもスピード重視」って感じがありありと見て取れるのが、「なんだかなあ」と感じています。 早いところ共通CSSの設定やFTP領域のとの連携強化を実施して欲しいのですが、「作業効率には直結するものの、店舗の売上げには直結しない部分」へのシステム変更は後回しにされる傾向は相変わらずです。 実際に店舗を運営するスタッフは、ページ制作も担当する場合がほとんどなので、作業効率の改善
構想に1年、制作に２週間。（実制作時間は40時間くらいかな？）非常に長い時間をかけてやっとオリジナルのWordpressのテーマが出来ました。詰めが甘い部分が多々あるので、運用しながら色々修正して行こうと思いますが、とりあえずは一通り形になって一安心です。 WordPressのオリジナルテーマ作りの流れ デザインする（ラフを描いて、Photoshopでレイアウトとパーツを作る） HTMLとCSSでコーディングする WordPressテンプレートにする デザイン これは本業というか今まで散々やってきた事なので、すぐに終わりました。そんなに手の込んだものを作ろうとも思ってなかったので制作時間4〜6時間程度？で終了です。 流行のフラットデザインを取り入得れようかなとちょっと心をよぎったものの時間を優先するため以前に作りかけて放置していたデザインをそのまま流用。クオリティ的にはちょっとアレな部分も
最強版と書きましたが、「何をもって最強と言っているんだ」「誇大表現じゃないのか」「俺のほうが強えから勝負だ！」などのご意見はとりあえずご容赦下さい。「当社比」または「独自の調査による」って魔法の言葉で何卒ご勘弁を。 そのうち「最強版2」とか「続・最強版」とか「最強版ZXターボ」とか出てくる可能性もありますが、そちらもあわせてご勘弁願えれば幸いです。ちなみに「最終セール」を何度もやったり、「閉店セール」を8年間続けたりというオオカミ少年的な行為は、お客様の信頼を著しく損ないますので、絶対にやってはいけません。 遂に登場！リンクの出来る縦バナー 書く書くって言って全然書いてませんでしたが、準備はしていたんです。勉強しなさいって怒られた瞬間の中学生みたいな言い訳ですが、本当です。本当に途中までは書いていたんですが、夏なので誘惑が多くて完成させられなかったんです。 そして今、他にやる事がいっぱい過
過去記事：こちらもどうぞ コピペでOK！楽天のページにjQueryで動くバナーを設置する方法 ネットショップ担当者になったばかりで、HTMLやCSSもよくわからんのに、いきなり「このシュッて動くバナーのやつ作って」と上司に言われ、ググってググってこのページたどり着いたみなさん、こんにちわ。 そうでなくてもWEBデザイン初心者の方たちの役に立つ内容だと思いますので、まあだまされたと思って、最後までお付き合いいただければ幸いです。 あくまでHTMLやCSSの初心者、かつネットショップ担当者（特に楽天）に向けて記事を書いておりますので、その他に方には余計な記述もあります。「俺ネットショップ関係無いし」って方は、必要無い部分を読み飛ばしていただければ、通常の記事として読めると思います。 jQueryとは 引用 https://ja.wikipedia.org/wiki/JQuery jQuery（
「売れている楽天のショップ」 「担当のECCからここを参考にしたら良いと言われたショップ」 「なんかかっこいいなと思ったショップ」 それらのショップにはほとんどの場合「動くバナー」が設置されていたりしませんか？ 「どうやってやるんだろう」「うちの店舗では無理だな」そんな風に思っている担当者の皆様ご安心下さい。ハカセの研究室なら簡単にコピペだけで導入出来ます。しかも無料です。 今まで出来なかった事が出来る。そう、jQueryならね。 いきなりうざい感じで始まりましたが、本日はやってみたいと考えてる方も多いはずの「jQuery（ジェイクエリー）」を使用した動くバナーの導入方法を説明します。 jQueryとは？ オープンソースのJavaScriptライブラリの一つ。2006年1月にJohn Resig氏が最初のバージョンを公開し、現在は有志プログラマによる開発者集団「jQuery Tea
OlivineEditorというMac・Windows・Linuxで使えるアウトラインプロセッサが神アプリかも知れない件。 アウトラインプロセッサ（outline processor）とは、コンピュータで文書のアウトライン構造（全体の構造）を定めてから、細部を編集していくために用いられる文書作成ソフトウェア。英語ではoutlinerという呼称が一般的。 Wikipediaより となっているが、個人的には、文章の要素を適当に思いつく限り書き出して、カテゴリごとにまとめたり、順番を並べ替えたりしながら効率的に文章を書くためだったり、アイデアをまとめるために使ったりしている。 ECサイトの運営においては、商品ページの情報をまとめたり、長文のメルマガの構造を決めたり。HTML・CSSのコードなどを保存したりと大活躍だ。Power Mac以後は完全にWindows派だったため、「アイデアツリー」と
楽天GOLDはR-Datetoolのアクセス分析対象外 店舗のトップページを楽天GOLD（ftpサーバ）に設置している店舗も多いはず。人気店がそうしているから、真似してやってる人も多い？かも知れませんね・・・。他の事でも言えるのですが、楽天のサービスはそれぞれが独立していて連携していないものが多いです。当然の様に楽天GOLDではR-Datetoolでのアクセス分析は適用されず、アクセス数を調べる事が出来ません。 いったい何人がTOPページにアクセスしているのか判らない、そんな時代遅れ？の状態なのです。 これではTOPページの作成・更新にも力が入りません。 R−Storefrontのカテゴリページを利用する アクセス解析を入れたくても、楽天GOLDではサーバサイドのスクリプトは使えません。（PHP・Perlなど）さらに外部リンクも不可なので、アクセス数を調べるには楽天内のページを利用するし
外部のスタイルシートファイルを使用すると、同じテンプレートを使用する事の多いネットショップのスタイルの管理は格段に効率化します。 更新頻度も多いですし、全ページに表示しているバナーを一括で非表示にしたりも一瞬で出来ます。 楽天GOLD（ftpのサービスです別途申し込みが必要）にCSSファイルをアップロードして、ページで読み込むただそれだけなのですが、注意点が幾つかあります。 ・商品ページ（PC用商品説明文・モバイル商品説明文・PC用販売説明文）にはlinkタグは使えないため、「デザイン設定」の「ヘッダー・フッター・レフトナビ」あたりに下記の様なタグを埋め込み、CSSファイルを読み込む必要があります。 <link rel="stylesheet" href="CSSファイルの絶対パス" /> 楽天GOLDの契約が必須（無料のはずです）となりますが、CSSを外部ファイルにしておく事で作業効率
楽天のページでよく見かける「縦バナー」。効果の程は知らないけど、お祭りっぽい雰囲気は出てる気がする。どうせなら両側に付ければ良いのに、意外と片側にしか付けてない店舗が多い。「ダサくね？」って「楽天のサイトにかっこ良さなんて求めてねぇよ」って言われそうだけど、もう少しまともに出来る方法をまとめてみた。 ■縦バナー設置の流れ 縦バナーに使う画像を用意⇒R-cabinetに登録 楽天RMSの「R-storefront＞デザイン設定＞テンプレート設定＞ヘッダー・フッター・レフトナビ」で新規テンプレートを作って、そこに下記のコードを貼り付ける。そのテンプレートを「自動選択テンプレート」にしてあげれば、個別にテンプレートを設定していないページは全部適用される。（GOLD領域を除く） ■まずは従来の縦バナー設置方法（これで充分な場合も多い？） ・パターン1（片側） cssでbodyの背景イメージを設
このページを最初にブックマークしてみませんか？
『【初心者向け】jQueryでスライドバナー最新版（2018年6月）』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
