ナビゲーション03｜フッターウィジェット用
croover
WordPressテーマ「JIN:R」は、誰でも最高に使いやすいツールを目指して作り上げました
コードをコピー
<!-- wp:jinr-blocks/fullwidth {"fullWidthBgColor":"#fcfcfc","fullWidthPaddingPc":"d\u002d\u002dfullwidth-pad40","fullWidthPaddingSp":"d\u002d\u002dfullwidth-pad20-sp"} -->
<section class="wp-block-jinr-blocks-fullwidth b--jinr-block b--jinr-fullwidth-container"><section class="b--jinr-fullwidth" style="background-color:#fcfcfc"><div class="d--fullwidth-max d--fullwidth-pad40 d--fullwidth-pad20-sp t--main-width" style="color:#555555"><!-- wp:columns -->
<div class="wp-block-columns js--scr-animation"><!-- wp:column {"width":"350px"} -->
<div class="wp-block-column" style="flex-basis:350px"><!-- wp:image {"align":"center","id":1299,"width":256,"height":70,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image aligncenter size-large is-resized"><img src="http://jinr-theme.com/wp-content/uploads/2022/06/jinr-logo-1024x281.png" alt="" class="wp-image-1299" width="256" height="70"/></figure>
<!-- /wp:image -->
<!-- wp:paragraph -->
<p>WordPressテーマ「JIN:R」は、誰でも最高に使いやすいツールを目指して作り上げました</p>
<!-- /wp:paragraph -->
<!-- wp:jinr-blocks/button {"content":"ダウンロードはこちら","inputUrl":"https://jinr.jp/","className":"jinr-custom-navigation-button","jinrBlocksCSSAttribute":".jinr-custom-navigation-button.d\u002d\u002dbutton-type1 a\n{box-shadow:0 1px 3px rgba(170,170,170,0.4);\nbackground:#407fed !important;\npadding:11px 20px !important;\nborder-radius:5px;\nfont-size:15px;\n}"} -->
<div class="jinr-add-class-container"><div class="wp-block-jinr-blocks-button b--jinr-block b--jinr-button jinr-custom-navigation-button js--scr-animation">[jinr_button1 href="https://jinr.jp/" align="d--button-center"]<span>ダウンロードはこちら</span>[/jinr_button1]</div><style jsx="true">.jinr-custom-navigation-button.d--button-type1 a
{box-shadow:0 1px 3px rgba(170,170,170,0.4);
background:#407fed !important;
padding:11px 20px !important;
border-radius:5px;
font-size:15px;
}</style></div>
<!-- /wp:jinr-blocks/button --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"20%"} -->
<div class="wp-block-column" style="flex-basis:20%"><!-- wp:jinr-blocks/background {"backgroundBgColor":"#ffffff","backgroundBorderColor":"#f7f7f7","className":"wp-block-jinr-blocks-background b\u002d\u002djinr-block b\u002d\u002djinr-background jinr-custom-navigation01","jinrBlocksCSSAttribute":".jinr-custom-navigation01 .c\u002d\u002dbackground-inner{\npadding:15px 40px;\n}\n\n@media (max-width: 781px){\n.jinr-custom-navigation01 .wp-block-columns{\ngap:0 !important;\n}\n.wp-block-columns:not(.is-not-stacked-on-mobile) \u003e .wp-block-column:not(:first-child){\nmargin-left:0 !Important;\n}\n}\n\n.wp-block-columns:not(.is-not-stacked-on-mobile) \u003e .wp-block-column{\nmargin-bottom:0 !Important;}\n\n.jinr-custom-navigation01 p{\nmargin:14px 0 14px 0 !important;\n}\n\n\n.jinr-custom-navigation01 a{\ncolor:#444 !Important;\ntext-decoration:none !important;\ntransition:.3s;\n}\n\n.jinr-custom-navigation01 a:hover{\nopacity:.7;\n}"} -->
<div class="jinr-add-class-container"><div class="wp-block-jinr-blocks-background b--jinr-block b--jinr-background jinr-custom-navigation01"><div class="o--background-container d--background-design-flat d--background-shadow-s d--border-outset"><div class="c--background-inner d--border-none d--border-1px t--round" style="border-color:#f7f7f7"><!-- wp:paragraph -->
<p><strong>カテゴリー</strong></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>01</strong> 新規ドキュメント</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>02</strong> ファイルを保存</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>03</strong> 表示倍率の変更</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>04</strong> 表示範囲の変更</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>05</strong> ワークスペース</a></p>
<!-- /wp:paragraph --></div></div><div class="a--background-color" style="background:#ffffff"></div><div class="a--background-image t--round d--background-pattern1" style="opacity:0.29999999999999993;background-size:16.666666666666668%"></div></div><style jsx="true">.jinr-custom-navigation01 .c--background-inner{
padding:15px 40px;
}
@media (max-width: 781px){
.jinr-custom-navigation01 .wp-block-columns{
gap:0 !important;
}
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column:not(:first-child){
margin-left:0 !Important;
}
}
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column{
margin-bottom:0 !Important;}
.jinr-custom-navigation01 p{
margin:14px 0 14px 0 !important;
}
.jinr-custom-navigation01 a{
color:#444 !Important;
text-decoration:none !important;
transition:.3s;
}
.jinr-custom-navigation01 a:hover{
opacity:.7;
}</style></div>
<!-- /wp:jinr-blocks/background --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"20%"} -->
<div class="wp-block-column" style="flex-basis:20%"><!-- wp:jinr-blocks/background {"backgroundBgColor":"#ffffff","backgroundBorderColor":"#ffffff","className":"wp-block-jinr-blocks-background b\u002d\u002djinr-block b\u002d\u002djinr-background jinr-custom-navigation01","jinrBlocksCSSAttribute":".jinr-custom-navigation01 .c\u002d\u002dbackground-inner{\npadding:15px 40px;\n}\n\n@media (max-width: 781px){\n.jinr-custom-navigation01 .wp-block-columns{\ngap:0 !important;\n}\n.wp-block-columns:not(.is-not-stacked-on-mobile) \u003e .wp-block-column:not(:first-child){\nmargin-left:0 !Important;\n}\n}\n\n.wp-block-columns:not(.is-not-stacked-on-mobile) \u003e .wp-block-column{\nmargin-bottom:0 !Important;}\n\n.jinr-custom-navigation01 p{\nmargin:14px 0 14px 0 !important;\n}\n\n\n.jinr-custom-navigation01 a{\ncolor:#444 !Important;\ntext-decoration:none !important;\ntransition:.3s;\n}\n\n.jinr-custom-navigation01 a:hover{\nopacity:.7;\n}"} -->
<div class="jinr-add-class-container"><div class="wp-block-jinr-blocks-background b--jinr-block b--jinr-background jinr-custom-navigation01"><div class="o--background-container d--background-design-flat d--background-shadow-s d--border-outset"><div class="c--background-inner d--border-none d--border-1px t--round" style="border-color:#ffffff"><!-- wp:paragraph -->
<p><strong>カテゴリー</strong></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>01</strong> 新規ドキュメント</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>02</strong> ファイルを保存</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>03</strong> 表示倍率の変更</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>04</strong> 表示範囲の変更</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>05</strong> ワークスペース</a></p>
<!-- /wp:paragraph --></div></div><div class="a--background-color" style="background:#ffffff"></div><div class="a--background-image t--round d--background-pattern1" style="opacity:0.29999999999999993;background-size:16.666666666666668%"></div></div><style jsx="true">.jinr-custom-navigation01 .c--background-inner{
padding:15px 40px;
}
@media (max-width: 781px){
.jinr-custom-navigation01 .wp-block-columns{
gap:0 !important;
}
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column:not(:first-child){
margin-left:0 !Important;
}
}
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column{
margin-bottom:0 !Important;}
.jinr-custom-navigation01 p{
margin:14px 0 14px 0 !important;
}
.jinr-custom-navigation01 a{
color:#444 !Important;
text-decoration:none !important;
transition:.3s;
}
.jinr-custom-navigation01 a:hover{
opacity:.7;
}</style></div>
<!-- /wp:jinr-blocks/background --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"20%"} -->
<div class="wp-block-column" style="flex-basis:20%"><!-- wp:jinr-blocks/background {"backgroundBgColor":"#ffffff","backgroundBorderColor":"#ffffff","className":"wp-block-jinr-blocks-background b\u002d\u002djinr-block b\u002d\u002djinr-background jinr-custom-navigation01","jinrBlocksCSSAttribute":".jinr-custom-navigation01 .c\u002d\u002dbackground-inner{\npadding:15px 40px;\n}\n\n@media (max-width: 781px){\n.jinr-custom-navigation01 .wp-block-columns{\ngap:0 !important;\n}\n.wp-block-columns:not(.is-not-stacked-on-mobile) \u003e .wp-block-column:not(:first-child){\nmargin-left:0 !Important;\n}\n}\n\n.wp-block-columns:not(.is-not-stacked-on-mobile) \u003e .wp-block-column{\nmargin-bottom:0 !Important;}\n\n.jinr-custom-navigation01 p{\nmargin:14px 0 14px 0 !important;\n}\n\n\n.jinr-custom-navigation01 a{\ncolor:#444 !Important;\ntext-decoration:none !important;\ntransition:.3s;\n}\n\n.jinr-custom-navigation01 a:hover{\nopacity:.7;\n}"} -->
<div class="jinr-add-class-container"><div class="wp-block-jinr-blocks-background b--jinr-block b--jinr-background jinr-custom-navigation01"><div class="o--background-container d--background-design-flat d--background-shadow-s d--border-outset"><div class="c--background-inner d--border-none d--border-1px t--round" style="border-color:#ffffff"><!-- wp:paragraph -->
<p><strong>カテゴリー</strong></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>01</strong> 新規ドキュメント</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>02</strong> ファイルを保存</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>03</strong> 表示倍率の変更</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>04</strong> 表示範囲の変更</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><a href="#"><strong>05</strong> ワークスペース</a></p>
<!-- /wp:paragraph --></div></div><div class="a--background-color" style="background:#ffffff"></div><div class="a--background-image t--round d--background-pattern1" style="opacity:0.29999999999999993;background-size:16.666666666666668%"></div></div><style jsx="true">.jinr-custom-navigation01 .c--background-inner{
padding:15px 40px;
}
@media (max-width: 781px){
.jinr-custom-navigation01 .wp-block-columns{
gap:0 !important;
}
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column:not(:first-child){
margin-left:0 !Important;
}
}
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column{
margin-bottom:0 !Important;}
.jinr-custom-navigation01 p{
margin:14px 0 14px 0 !important;
}
.jinr-custom-navigation01 a{
color:#444 !Important;
text-decoration:none !important;
transition:.3s;
}
.jinr-custom-navigation01 a:hover{
opacity:.7;
}</style></div>
<!-- /wp:jinr-blocks/background --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div></section></section>
<!-- /wp:jinr-blocks/fullwidth -->