カレンダー

03 | 2017/04 | 05
- - - - - - 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 - - - - - -

広告



最近の記事

カテゴリー

DATE: CATEGORY:スポンサー広告


上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

DATE: CATEGORY:DEV


スマホから見た時の表示イメージが気に入らない。

そんな理由で、先日作成したブックマークレットを
少し修正しました。

サイトへのリンクを簡単に生成するブックマークレット:なんとなしの日記サイトへのリンクを簡単に生成するブックマークレット:なんとなしの日記hatena
内部サイトも含めて、ブログ記事にサイトのリンクを貼り付ける際、URLをコピーして貼り付けて、タイトルをコピーして貼り付けて、aタグでリンクにして、、、ってのがめ


スマホからどう見えてたか


これ。サムネイル画像がデカイ。

IMG_1275
Photo:IMG_1275 By onetohihi

まぁ、これはこれでいいんですが、
CSSでコントロール出来るようにしとけば
いいかなぁ、ってことで修正をしときました。

ブックマークレットと使い方


サイトリンク生成ブックマークレット

基本的な使い方

上記のリンクをブラウザのブックマークバーに
ドラッグ&ドロップしておきます。

リンクを作りたいサイトをブラウザで開いたら、ブックマークバーの
ブックマークレットを選択します。
そしたらポップアップでリンク用HTMLとサンプルが表示されるので、
あとはそのHTMLをブログに貼り付けるだけです。

CSSに設定追加

CSSでサイズとかをコントロール出来るようにしているので、
CSSに以下を追加します。
スマホ向けのCSSには、サイズを50pxくらいで設定しました。


スマホの見え方どうなったか


スマホ側のCSSを50pxにした時の見え方です。
ちょっと小さくなりました。
少し大きくしたければCSSを修正するだけです。
IMG_1276
Photo:IMG_1276 By onetohihi

コード


最後にやっぱりコードを晒しとく


タグ : サイト リンク ブックマークレット bookmarklet

Comment

コメントの投稿

管理者にだけ表示を許可する


トラックバック


この記事にトラックバックする



copyright © なんとなしの日記 all rights reserved.
内職☆在宅ワークの最強は?アフィリエイト!. 初心者だってカッコ良いホームページ作るぅ!
Powered by FC2ブログ
Related Posts Plugin for WordPress, Blogger...
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。