CINXE.COM

デザインテーマをインストールする - はてなブログ ヘルプ

<!DOCTYPE html><html lang="ja" data-admin-domain="//blog.hatena.ne.jp" data-admin-origin="https://blog.hatena.ne.jp" data-author="hatenablog" data-avail-langs="ja en" data-blog="help.hatenablog.com" data-blog-host="help.hatenablog.com" data-blog-is-public="1" data-blog-name="はてなブログ ヘルプ" data-blog-owner="hatenablog" data-blog-show-ads="" data-blog-show-sleeping-ads="" data-blog-uri="https://help.hatenablog.com/" data-blog-uuid="13208647353034080391" data-blogs-uri-base="https://help.hatenablog.com" data-brand="regular_plan" data-data-layer="{&quot;hatenablog&quot;:{&quot;admin&quot;:{},&quot;analytics&quot;:{&quot;brand_property_id&quot;:&quot;UA-69076420-1&quot;,&quot;measurement_id&quot;:&quot;&quot;,&quot;non_sampling_property_id&quot;:&quot;&quot;,&quot;property_id&quot;:&quot;UA-29716941-11&quot;,&quot;separated_property_id&quot;:&quot;UA-29716941-17&quot;},&quot;blog&quot;:{&quot;blog_id&quot;:&quot;13208647353034080391&quot;,&quot;content_seems_japanese&quot;:&quot;true&quot;,&quot;disable_ads&quot;:&quot;brand&quot;,&quot;enable_ads&quot;:&quot;false&quot;,&quot;enable_keyword_link&quot;:&quot;false&quot;,&quot;entry_show_footer_related_entries&quot;:&quot;false&quot;,&quot;force_pc_view&quot;:&quot;true&quot;,&quot;is_public&quot;:&quot;true&quot;,&quot;is_responsive_view&quot;:&quot;true&quot;,&quot;is_sleeping&quot;:&quot;false&quot;,&quot;lang&quot;:&quot;ja&quot;,&quot;name&quot;:&quot;\u306f\u3066\u306a\u30d6\u30ed\u30b0 \u30d8\u30eb\u30d7&quot;,&quot;owner_name&quot;:&quot;hatenablog&quot;,&quot;uri&quot;:&quot;https://help.hatenablog.com/&quot;},&quot;brand&quot;:&quot;regular_plan&quot;,&quot;page_id&quot;:&quot;entry&quot;,&quot;permalink_entry&quot;:{&quot;author_name&quot;:&quot;hatenablog&quot;,&quot;categories&quot;:&quot;\u30c7\u30b6\u30a4\u30f3\u30ab\u30b9\u30bf\u30de\u30a4\u30ba&quot;,&quot;character_count&quot;:1967,&quot;date&quot;:&quot;2019-08-01&quot;,&quot;entry_id&quot;:&quot;26006613383128564&quot;,&quot;first_category&quot;:&quot;\u30c7\u30b6\u30a4\u30f3\u30ab\u30b9\u30bf\u30de\u30a4\u30ba&quot;,&quot;hour&quot;:&quot;12&quot;,&quot;title&quot;:&quot;\u30c7\u30b6\u30a4\u30f3\u30c6\u30fc\u30de\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b&quot;,&quot;uri&quot;:&quot;https://help.hatenablog.com/entry/theme/install_theme&quot;},&quot;pro&quot;:&quot;pro&quot;,&quot;router_type&quot;:&quot;blogs&quot;}}" data-device="pc" data-dont-recommend-pro="false" data-global-domain="https://hatena.blog" data-globalheader-color="b" data-globalheader-type="pc" data-has-touch-view="1" data-help-url="https://help.hatenablog.com" data-hide-header="1" data-no-suggest-touch-view="1" data-page="entry" data-parts-domain="https://hatenablog-parts.com" data-plus-available="1" data-pro="true" data-router-type="blogs" data-sentry-dsn="https://03a33e4781a24cf2885099fed222b56d@sentry.io/1195218" data-sentry-environment="production" data-sentry-sample-rate="0.1" data-static-domain="https://cdn.blog.st-hatena.com" data-version="add51ddc2d3c0599e98ea1239ac012" data-initial-state="{}"><head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="robots" content="max-image-preview:large"> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7; IE=9; IE=10; IE=11"> <title>デザインテーマをインストールする - はてなブログ ヘルプ</title> <link rel="canonical" href="https://help.hatenablog.com/entry/theme/install_theme"> <meta itemprop="name" content="デザインテーマをインストールする - はてなブログ ヘルプ"> <meta itemprop="image" content="https://cdn.image.st-hatena.com/image/scale/6d160a4980508f5777bfc0c4bcb44645ce8f48b4/backend=imagemagick;height=1300;version=1;width=1300/https%3A%2F%2Fcdn.user.blog.st-hatena.com%2Fdefault_entry_og_image%2F62150696%2F15142248443714"> <meta property="og:title" content="デザインテーマをインストールする - はてなブログ ヘルプ"> <meta property="og:type" content="article"> <meta property="og:url" content="https://help.hatenablog.com/entry/theme/install_theme"> <meta property="og:image" content="https://cdn.image.st-hatena.com/image/scale/6d160a4980508f5777bfc0c4bcb44645ce8f48b4/backend=imagemagick;height=1300;version=1;width=1300/https%3A%2F%2Fcdn.user.blog.st-hatena.com%2Fdefault_entry_og_image%2F62150696%2F15142248443714"> <meta property="og:image:alt" content="デザインテーマをインストールする - はてなブログ ヘルプ"> <meta property="og:description" content="はてなブログでは、「テーマストア」からはてなブログ公式のデザインテーマやはてなブログユーザーが作成したデザインテーマを自分のブログにインストールできます。"> <meta property="og:site_name" content="はてなブログ ヘルプ"> <meta property="article:published_time" content="1564629980"> <meta property="article:tag" content="デザインカスタマイズ"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:image" content="https://cdn.image.st-hatena.com/image/scale/6d160a4980508f5777bfc0c4bcb44645ce8f48b4/backend=imagemagick;height=1300;version=1;width=1300/https%3A%2F%2Fcdn.user.blog.st-hatena.com%2Fdefault_entry_og_image%2F62150696%2F15142248443714"> <meta name="twitter:title" content="デザインテーマをインストールする - はてなブログ ヘルプ"> <meta name="twitter:description" content="はてなブログでは、「テーマストア」からはてなブログ公式のデザインテーマやはてなブログユーザーが作成したデザインテーマを自分のブログにインストールできます。"> <meta name="twitter:app:name:iphone" content="はてなブログアプリ"> <meta name="twitter:app:id:iphone" content="583299321"> <meta name="twitter:app:url:iphone" content="hatenablog:///open?uri=https%3A%2F%2Fhelp.hatenablog.com%2Fentry%2Ftheme%2Finstall_theme"> <meta name="twitter:site" content="@hatenablog"> <meta name="description" content="はてなブログでは、「テーマストア」からはてなブログ公式のデザインテーマやはてなブログユーザーが作成したデザインテーマを自分のブログにインストールできます。"> <meta name="keywords" content="はてな,ブログ,ヘルプ"> <script id="embed-gtm-data-layer-loader" data-data-layer-page-specific="{&quot;hatenablog&quot;:{&quot;blogs_permalink&quot;:{&quot;is_author_pro&quot;:&quot;true&quot;,&quot;has_related_entries_with_elasticsearch&quot;:&quot;false&quot;,&quot;blog_afc_issued&quot;:&quot;false&quot;,&quot;is_blog_sleeping&quot;:&quot;false&quot;,&quot;entry_afc_issued&quot;:&quot;false&quot;}}}"> (function() { function loadDataLayer(elem, attrName) { if (!elem) { return {}; } var json = elem.getAttribute(attrName); if (!json) { return {}; } return JSON.parse(json); } var globalVariables = loadDataLayer( document.documentElement, 'data-data-layer' ); var pageSpecificVariables = loadDataLayer( document.getElementById('embed-gtm-data-layer-loader'), 'data-data-layer-page-specific' ); var variables = [globalVariables, pageSpecificVariables]; if (!window.dataLayer) { window.dataLayer = []; } for (var i = 0; i < variables.length; i++) { window.dataLayer.push(variables[i]); } })(); </script> <!-- Google Tag Manager --> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-P4CXTW');</script> <!-- End Google Tag Manager --> <link rel="shortcut icon" href="https://help.hatenablog.com/icon/favicon"> <link rel="apple-touch-icon" href="https://help.hatenablog.com/icon/touch"> <link rel="icon" sizes="192x192" href="https://help.hatenablog.com/icon/link"> <link rel="alternate" type="application/atom+xml" title="Atom" href="https://help.hatenablog.com/feed"> <link rel="alternate" type="application/rss+xml" title="RSS2.0" href="https://help.hatenablog.com/rss"> <link rel="alternate" type="application/json+oembed" href="https://hatena.blog/oembed?url=https%3A%2F%2Fhelp.hatenablog.com%2Fentry%2Ftheme%2Finstall_theme&amp;format=json" title="oEmbed Profile of デザインテーマをインストールする"> <link rel="alternate" type="text/xml+oembed" href="https://hatena.blog/oembed?url=https%3A%2F%2Fhelp.hatenablog.com%2Fentry%2Ftheme%2Finstall_theme&amp;format=xml" title="oEmbed Profile of デザインテーマをインストールする"> <link rel="author" href="http://www.hatena.ne.jp/hatenablog/"> <link rel="stylesheet" type="text/css" href="https://cdn.blog.st-hatena.com/css/blog.css?version=add51ddc2d3c0599e98ea1239ac012"> <link rel="stylesheet" type="text/css" href="https://usercss.blog.st-hatena.com/blog_style/13208647353034080391/722a44294c89ae37814ccb135d6262295aa5f27c"> <script> </script> <style> div#google_afc_user, div.google-afc-user-container, div.google_afc_image, div.google_afc_blocklink { display: block !important; } </style> <script type="application/ld+json">{"@context":"http://schema.org","@type":"Article","dateModified":"2024-06-18T12:19:05+09:00","datePublished":"2019-08-01T12:26:20+09:00","headline":"デザインテーマをインストールする","image":["https://cdn.user.blog.st-hatena.com/default_entry_og_image/62150696/15142248443714"]}</script> <!-- Google Tag Manager --> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-KJZ3HS9');</script> <!-- End Google Tag Manager --> <meta name="viewport" content="width=device-width"> <script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-29716941-31', 'auto'); ga('send', 'pageview'); </script> <script type="text/javascript"> (function(c,l,a,r,i,t,y){ c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)}; t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i; y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y); })(window, document, "clarity", "script", "5cw1jc89ui"); </script> <!-- Global site tag (gtag.js) - Google Analytics cs@--> <script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-189387219-1"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-189387219-1'); </script> </head> <body class="page-entry enable-top-editarea enable-bottom-editarea category-デザインカスタマイズ globalheader-off globalheader-ng-enabled"> <div id="globalheader-container" data-brand="hatenablog" style="display: none"> <iframe id="globalheader" height="37" frameborder="0" allowtransparency="true"></iframe> </div> <div id="container"> <div id="container-inner"> <div id="top-editarea"> <!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KJZ3HS9" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <!-- End Google Tag Manager (noscript) --> <div class="header-wrapper"> <div class="header-wrapper-inner"> <nav class="header-logo-hatenablog"><a href="http://hatenablog.com/"> <img src="https://cdn.blog.st-hatena.com/css/theme/help/images/logo-hatenablog.svg" alt="Hatena Blog" class="header-logo-hatenablog-img"></a> </nav> <header class="blog-title"> <div id="blog-title-inner"> <div id="blog-title-content"> <h1 id="title"><a href="/">はてなブログ ヘルプ</a></h1> </div> </div> </header> <div class="header-search"> <form class="search-form" role="search" action="/search" method="get"> <input type="text" name="q" class="search-module-input" value="" placeholder="ヘルプを検索" required=""> <input type="submit" value="検索" class="search-module-button"> </form> </div> </div> </div> </div> <div id="content" class="hfeed"> <div id="content-inner"> <div id="wrapper"> <div id="main"> <div id="main-inner"> <!-- google_ad_section_start --> <!-- rakuten_ad_target_begin --> <article class="entry hentry test-hentry js-entry-article date-first autopagerize_page_element chars-2000 words-100 mode-hatena entry-odd" id="entry-26006613383128564" data-keyword-campaign="" data-uuid="26006613383128564" data-publication-type="entry"> <div class="entry-inner"> <header class="entry-header"> <div class="date entry-date first"> <a href="https://help.hatenablog.com/archive/2019/08/01" rel="nofollow"> <time datetime="2019-08-01T03:26:20Z" title="2019-08-01T03:26:20Z"> <span class="date-year">2019</span><span class="hyphen">-</span><span class="date-month">08</span><span class="hyphen">-</span><span class="date-day">01</span> </time> </a> </div> <h1 class="entry-title"> <a href="https://help.hatenablog.com/entry/theme/install_theme" class="entry-title-link bookmark">デザインテーマをインストールする</a> </h1> <div class="entry-categories categories"> <a href="https://help.hatenablog.com/archive/category/%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA" class="entry-category-link category-デザインカスタマイズ">デザインカスタマイズ</a> </div> </header> <div class="entry-content hatenablog-entry"> <p>はてなブログでは、「<a href="https://blog.hatena.ne.jp/-/store/theme/">テーマストア</a>」からはてなブログ公式のデザインテーマやはてなブログユーザーが作成したデザインテーマを自分のブログにインストールできます。</p> <ul class="table-of-contents"> <li><a href="#デザインテーマとは">デザインテーマとは</a></li> <li><a href="#テーマストア">テーマストア</a></li> <li><a href="#テーマストアからデザインテーマをインストールする方法">テーマストアからデザインテーマをインストールする方法</a></li> <li><a href="#デザイン設定画面からデザインテーマをインストールする">デザイン設定画面からデザインテーマをインストールする</a><ul> <li><a href="#レスポンシブ対応のデザインか確認する">レスポンシブ対応のデザインか確認する</a></li> <li><a href="#レスポンシブデザイン対応している公式デザインテーマ">レスポンシブデザイン対応している公式デザインテーマ</a></li> </ul> </li> <li><a href="#レスポンシブデザイン設定をする">レスポンシブデザイン設定をする</a></li> <li><a href="#関連項目">関連項目</a></li> <li><a href="#関連記事">関連記事</a></li> </ul> <div class="section"> <h3 id="デザインテーマとは">デザインテーマとは</h3> <p>デザインテーマは、はてなブログ公式やユーザーが作成したはてなブログ専用のCSSです。テーマストアからデザインテーマをインストールすれば、CSSの知識がなくても、自分のブログに好みのデザインを適用することができます。</p> <div class="callout-info">オリジナルのデザインテーマを作成したい場合は、ヘルプ「<a href="http://help.hatenablog.com/entry/theme/custom-theme">デザインテーマ制作の手引き</a>」を参照してください。</div> </div> <div class="section"> <h3 id="テーマストア">テーマストア</h3> <p>テーマストアでは、デザインテーマが「人気順」や「新着順」などカテゴリ別に一覧で表示されています。</p><figure class="figure-image figure-image-fotolife" title=" "><span itemscope="" itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/h/hatenablog/20190801/20190801121409.png" width="1200" height="618" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></figure>各デザインテーマの紹介ページでは、「テーマの説明」や「テーマ作者」、「インストール数」、「投稿日」、「注意」などが確認できます。<figure class="figure-image figure-image-fotolife" title=" "><span itemscope="" itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/h/hatenablog/20190801/20190801121415.png" width="1193" height="1200" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span><figcaption> </figcaption></figure>また、「利用中のブログ」タブでは、そのデザインテーマをインストールしているブログを一覧で見ることができます。<figure class="figure-image figure-image-fotolife" title=" "><span itemscope="" itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/h/hatenablog/20190801/20190801121438.png" width="849" height="300" loading="lazy" title="" class="hatena-fotolife" style="width:450px" itemprop="image"></span></figure><p></p> </div> <div class="section"> <h3 id="テーマストアからデザインテーマをインストールする方法">テーマストアからデザインテーマをインストールする方法</h3> <p>テーマストアから好みのデザインテーマを選択し、デザインテーマの紹介ページに移動します。紹介ページの右側にある「<code>プレビューしてインストール</code>」ボタンを押すと、「適用するブログを選択」という画面が表示されるので、テーマを適用したいブログを選択してください。</p><figure class="figure-image figure-image-fotolife" title=" "><span itemscope="" itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/h/hatenablog/20190801/20190801121420.png" width="638" height="444" loading="lazy" title="" class="hatena-fotolife" style="width:300px" itemprop="image"></span></figure><p></p><p>ブログにデザインテーマをインストールした場合のプレビュー画面に移行するので、表示されているデザインテーマを適用する場合は、「<code>このテーマをインストール</code>」ボタンを押せばインストールは完了です。</p><figure class="figure-image figure-image-fotolife" title=" "><span itemscope="" itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/h/hatenablog/20190801/20190801121434.png" width="1200" height="179" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></figure><p></p><p>また、過去にブログに適用したデザインテーマは、テーマストアトップの「インストールしたテーマ」から一覧で確認できます。</p><p></p><figure class="figure-image figure-image-fotolife" title=" "><span itemscope="" itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/h/hatenablog/20190801/20190801121423.png" width="1200" height="441" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></figure><p></p> <div class="callout-info">一部のデザインテーマは、はてなブログPro(有料プラン)の機能を想定して作られている場合があります。</div> </div> <div class="section"> <h3 id="デザイン設定画面からデザインテーマをインストールする">デザイン設定画面からデザインテーマをインストールする</h3> <p>はてなブログ公式のデザインテーマは、ブログ管理画面の「<a href="https://blog.hatena.ne.jp/my/config/design/detail">デザイン設定画面</a>」にある「デザインテーマ」タブからもインストールできます。</p><p></p><figure class="figure-image figure-image-fotolife" title=" "><span itemscope="" itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/h/hatenablog/20190801/20190801121426.png" width="559" height="752" loading="lazy" title="" class="hatena-fotolife" style="width:300px" itemprop="image"></span></figure>好みのデザインテーマを選択するとプレビュー画面が表示されるので、問題がない場合は、「<code>変更を保存する</code>」ボタンを押せば、インストール完了です。<p></p> <div class="section"> <h4 id="レスポンシブ対応のデザインか確認する">レスポンシブ対応のデザインか確認する</h4> <p>スマートフォンでもPCと同一のデザインを使用したい場合はレスポンシブ対応のデザインテーマを設置してください。レスポンシブデザイン対応のはてなブログ公式デザインテーマには、テーマの説明文に【レスポンシブデザイン対応】という記載があります。</p><figure class="figure-image figure-image-fotolife" title=" "><span itemscope="" itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/h/hatenablog/20190801/20190801121430.png" width="872" height="942" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></figure>ユーザー作成のテーマのレスポンシブデザイン対応の可否に関しては、ヘルプ「<a href="http://help.hatenablog.com/entry/theme/custom-theme">デザインテーマ制作の手引き</a>」を参考にテーマの説明文やコードの確認を行うことを推奨します。<p></p> </div> <div class="section"> <h4 id="レスポンシブデザイン対応している公式デザインテーマ">レスポンシブデザイン対応している公式デザインテーマ</h4> <ul> <li><a href="https://blog.hatena.ne.jp/-/store/theme/6653458415119170889">Journal-Pink - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/6653458415119759185">Block Memo - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/10328537792364339459">Navy Blue - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/12921228815712830649">B!KUMA - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/12921228815712830662">Reach - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/12921228815712830666">Terminal - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/12921228815720753487">Evergreen - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/12921228815725504995">Arrow - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/12921228815728253347">寿司ゆき - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/98012380831185515">Smooth - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/10328749687191004942">Life - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/10257846132658936619">Push-up - テーマ ストア</a></li> <li><a href="https://blog.hatena.ne.jp/-/store/theme/26006613595110880">Neutral - テーマ ストア</a></li> </ul> </div> </div> <div class="section"> <h3 id="レスポンシブデザイン設定をする">レスポンシブデザイン設定をする</h3> <p>レスポンシブデザインの設定をする場合は、「<a href="https://blog.hatena.ne.jp/my/config/design/detail">デザイン設定画面</a>」の「スマートフォン」タブから「レスポンシブデザイン」設定をおこなってください。<br> 詳しくはヘルプ「<a href="http://help.hatenablog.com/entry/design/smartphone#%E3%83%AC%E3%82%B9%E3%83%9D%E3%83%B3%E3%82%B7%E3%83%96%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3">ブログのデザインを変更する(スマートフォン)</a>」を確認してください。</p> </div> <div class="section"> <h3 id="関連項目">関連項目</h3> <ul> <li><a href="http://help.hatenablog.com/entry/pro">はてなブログPro(有料プラン)</a></li> <li><a href="http://help.hatenablog.com/entry/design"> ブログのデザインを変更する</a></li> <li><a href="http://help.hatenablog.com/entry/theme/custom-theme">はてなブログテーマ制作の手引き</a></li> <li><a href="http://help.hatenablog.com/entry/design/customize">ブログのデザインを変更する(カスタマイズ)</a></li> <li><a href="http://help.hatenablog.com/entry/design/smartphone">ブログのデザインを変更する(スマートフォン)</a></li> </ul> </div> <div class="section"> <h3 id="関連記事">関連記事</h3> <ul> <li>2013-11-21 <a href="http://staff.hatenablog.com/entry/2013/11/21/143627"><img src="https://cdn-ak.favicon.st-hatena.com/?url=http%3A%2F%2Fstaff.hatenablog.com%2Fentry%2F2013%2F11%2F21%2F143627" alt="" class="http-favicon"></a><a href="http://staff.hatenablog.com/entry/2013/11/21/143627">デザイン設定とテーマ ストアを改善! いろいろなデザインテーマに着替えやすくなりました</a></li> <li>2013-04-10 <a href="http://staff.hatenablog.com/entry/2013/04/10/105917"><img src="https://cdn-ak.favicon.st-hatena.com/?url=http%3A%2F%2Fstaff.hatenablog.com%2Fentry%2F2013%2F04%2F10%2F105917" alt="" class="http-favicon"></a><a href="http://staff.hatenablog.com/entry/2013/04/10/105917">テーマ ストアをさらに強化したほか、下書き一覧などを追加しました</a></li> <li>2013-03-27 <a href="http://staff.hatenablog.com/entry/2013/03/27/191936"><img src="https://cdn-ak.favicon.st-hatena.com/?url=http%3A%2F%2Fstaff.hatenablog.com%2Fentry%2F2013%2F03%2F27%2F191936" alt="" class="http-favicon"></a><a href="http://staff.hatenablog.com/entry/2013/03/27/191936">デザインCSSをカスタマイズする土台に適したサンプルテーマを公開しました</a></li> <li>2013-02-20 <a href="http://staff.hatenablog.com/entry/2013/02/20/191131"><img src="https://cdn-ak.favicon.st-hatena.com/?url=http%3A%2F%2Fstaff.hatenablog.com%2Fentry%2F2013%2F02%2F20%2F191131" alt="" class="http-favicon"></a><a href="http://staff.hatenablog.com/entry/2013/02/20/191131">「テーマ ストア」をオープンしました</a></li> </ul> </div> </div> <footer class="entry-footer"> <div class="entry-tags-wrapper"> <div class="entry-tags"> </div> </div> <p class="entry-footer-section track-inview-by-gtm" data-gtm-track-json="{&quot;area&quot;: &quot;finish_reading&quot;}"> <span class="author vcard"><span class="fn" data-load-nickname="1" data-user-name="hatenablog">hatenablog</span></span> <span class="entry-footer-time"><a href="https://help.hatenablog.com/entry/theme/install_theme"><time data-relative="" datetime="2019-08-01T03:26:20Z" title="2019-08-01T03:26:20Z" class="updated">2019-08-01 12:26</time></a></span> </p> <div class="social-buttons"> </div> <div class="customized-footer"> <div class="entry-footer-html"><div class="js-gtm-related-entries"></div></div> </div> </footer> </div> </article> <!-- rakuten_ad_target_end --> <!-- google_ad_section_end --> <div class="pager pager-permalink permalink"> <span class="pager-prev"> <a href="https://help.hatenablog.com/entry/commercial-guidelines" rel="prev"> <span class="pager-arrow">« </span> はてなブログ個人営利利用ガイドライン(2… </a> </span> <span class="pager-next"> <a href="https://help.hatenablog.com/entry/design/design-css" rel="next"> デザインCSSを記述する <span class="pager-arrow"> »</span> </a> </span> </div> </div> </div> <aside id="box1"> <div id="box1-inner"> </div> </aside> </div><!-- #wrapper --> <aside id="box2"> <div id="box2-inner"> <div class="hatena-module hatena-module-html"> <div class="hatena-module-title">基本操作</div> <div class="hatena-module-body"> <ul class="hatena-urllist"> <li><a href="/entry/register">はてなブログを始める</a></li> <li><a href="/entry/config">ブログを設定する</a></li> <li><a href="/entry/design">デザインを変更する</a></li> <li><a href="/entry/writing">記事を書く</a></li> <li><a href="/entry/reading">ブログを読む</a> </li></ul> </div> </div> <div class="hatena-module hatena-module-html"> <div class="hatena-module-title">使いこなす</div> <div class="hatena-module-body"> <ul class="hatena-urllist"> <li><a href="/entry/pro">はてなブログPro(有料プラン)</a></li> <li><a href="/entry/blog-group">ブログ グループ</a></li> <li><a href="/entry/theme/custom-theme">テーマ制作の手引き</a></li> <li><a href="/entry/app/android">Androidアプリ</a></li> <li><a href="/entry/app/iphone">iPhoneアプリ</a></li> <li><a href="/entry/guideline">ガイドライン</a></li> </ul> </div> </div> <div class="hatena-module hatena-module-entries-access-ranking" data-count="10" data-source="access" data-enable_customize_format="0" data-display_entry_image_size_width="100" data-display_entry_image_size_height="100" data-display_entry_category="0" data-display_entry_image="0" data-display_entry_image_size_width="100" data-display_entry_image_size_height="100" data-display_entry_body_length="0" data-display_entry_date="0" data-display_entry_title_length="20" data-restrict_entry_title_length="0" data-display_bookmark_count="0"> <div class="hatena-module-title"> よく読まれているヘルプ </div> <div class="hatena-module-body"> </div> </div> <div class="hatena-module hatena-module-links"> <div class="hatena-module-title"> 関連リンク </div> <div class="hatena-module-body"> <ul class="hatena-urllist"> <li> <a href="http://staff.hatenablog.com/">はてなブログ開発ブログ(機能変更・お知らせ)</a> </li> <li> <a href="/entry/guideline">ガイドライン</a> </li> <li> <a href="http://htn.to/blogfaq">FAQとお問い合わせ</a> </li> </ul> </div> </div> </div> </aside> </div> </div> <div id="bottom-editarea"> <footer class="footer"> <address> Powered by <a href="http://hatenablog.com/">Hatena Blog</a> </address> </footer> </div> </div> </div> <div class="quote-box"> <div class="tooltip-quote tooltip-quote-stock"> <i class="blogicon-quote" title="引用をストック"></i> </div> <div class="tooltip-quote tooltip-quote-tweet js-tooltip-quote-tweet"> <a class="js-tweet-quote" target="_blank" data-track-name="quote-tweet" data-track-once=""> <img src="https://cdn.blog.st-hatena.com/images/admin/quote/quote-x-icon.svg?version=add51ddc2d3c0599e98ea1239ac012" title="引用して投稿する"> </a> </div> </div> <div class="quote-stock-panel" id="quote-stock-message-box" style="position: absolute; z-index: 3000"> <div class="message-box" id="quote-stock-succeeded-message" style="display: none"> <p>引用をストックしました</p> <button class="btn btn-primary" id="quote-stock-show-editor-button" data-track-name="curation-quote-edit-button">ストック一覧を見る</button> <button class="btn quote-stock-close-message-button">閉じる</button> </div> <div class="message-box" id="quote-login-required-message" style="display: none"> <p>引用するにはまずログインしてください</p> <button class="btn btn-primary" id="quote-login-button">ログイン</button> <button class="btn quote-stock-close-message-button">閉じる</button> </div> <div class="error-box" id="quote-stock-failed-message" style="display: none"> <p>引用をストックできませんでした。再度お試しください</p> <button class="btn quote-stock-close-message-button">閉じる</button> </div> <div class="error-box" id="unstockable-quote-message-box" style="display: none; position: absolute; z-index: 3000;"> <p>限定公開記事のため引用できません。</p> </div> </div> <script type="x-underscore-template" id="js-requote-button-template"> <div class="requote-button js-requote-button"> <button class="requote-button-btn tipsy-top" title="引用する"><i class="blogicon-quote"></i></button> </div> </script> <div id="hidden-subscribe-button" style="display: none;"> <div class="hatena-follow-button-box btn-subscribe js-hatena-follow-button-box"> <a href="#" class="hatena-follow-button js-hatena-follow-button"> <span class="subscribing"> <span class="foreground">読者です</span> <span class="background">読者をやめる</span> </span> <span class="unsubscribing" data-track-name="profile-widget-subscribe-button" data-track-once=""> <span class="foreground">読者になる</span> <span class="background">読者になる</span> </span> </a> <div class="subscription-count-box js-subscription-count-box"> <i></i> <u></u> <span class="subscription-count js-subscription-count"> </span> </div> </div> </div> <script async="" src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> <script src="https://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script> <script type="text/javascript" src="https://cdn.blog.st-hatena.com/js/external/jquery.min.js?v=1.12.4&amp;version=add51ddc2d3c0599e98ea1239ac012"></script> <script src="https://cdn.blog.st-hatena.com/js/texts-ja.js?version=add51ddc2d3c0599e98ea1239ac012"></script> <script id="vendors-js" data-env="production" src="https://cdn.blog.st-hatena.com/js/vendors.js?version=add51ddc2d3c0599e98ea1239ac012" crossorigin="anonymous"></script> <script id="hatenablog-js" data-env="production" src="https://cdn.blog.st-hatena.com/js/hatenablog.js?version=add51ddc2d3c0599e98ea1239ac012" crossorigin="anonymous" data-page-id="entry"></script> <script>Hatena.Diary.GlobalHeader.init()</script> </body></html>

Pages: 1 2 3 4 5 6 7 8 9 10