質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTTP

HTTP(Hypertext Transfer Protocol)とはweb上でHTML等のコンテンツを交換するために使われるアプリケーション層の通信プロトコルです。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

0回答

264閲覧

カルーセル?Webトップの画像が横にスライドされるやつについてなのですが、

satoshi1111

総合スコア13

HTTP

HTTP(Hypertext Transfer Protocol)とはweb上でHTML等のコンテンツを交換するために使われるアプリケーション層の通信プロトコルです。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2018/09/21 09:04

編集2022/01/12 10:55

私のHPでは上画像が横にスライドされるやつがついていて、スマホだとそれがスマホ用に若干縦長に大きく表示されるようになっています。

そして、HTMLにリンク付きのバナーをその下に入れたのですが、パソコン用のHPは良かったのですが、
スマホで見てみると、画像スライドの部分がパソコン用の大きさ(細さになってしまいます。)

どうすれば、画像が横にスライドされるやつはそのままで、その下にリンク付きのバナーを入れられますか?

HTML上の画像、URLは消してます。

どうかよろしくお願い致します。

これを入れたいです。[<div class="kaigyou"><br></div> <div class="web"> <a href="http/plan/" target="_blank"><img src="http.jpg" alt=""></a> </div>] <?php get_header(); ?> <!--// カルーセル開始 //--> <div id="carousel-first-generic" class="hidden-xs carousel slide" data-ride="carousel" data-interval="8000"> <!-- Indicators --> <ol class="carousel-indicators ind"> <li data-target="#carousel-first-generic" data-slide-to="0" class="active"></li> <li data-target="#carousel-first-generic" data-slide-to="1"></li> <li data-target="#carousel-first-generic" data-slide-to="2"></li> <li data-target="#carousel-first-generic" data-slide-to="3"></li> <li data-target="#carousel-first-generic" data-slide-to="4"></li> </ol> <!-- Wrapper for slides --> <div class="carousel-inner" role="listbox"> <!--// カルーセル1個目 --> <div class="item active"> <img src="top画像(2018).jpg" width="1800" height="730" alt="アンパン" class="img-responsive maximage" /> </div> <div class="item"> <img src="画像.jpg" width="1800" height="730" alt="カレー" class="img-responsive maximage" /> </div> <div class="item"> <img src="http:/.jpg" width="1800" height="730" alt="食" class="img-responsive maximage" /> </div> <div class="item"> <img src="http://ww1.jpg" width="1800" height="730" alt="パン" class="img-responsive maximage" /> </div> <div class="item"> <img src="htフェ1.jpg" width="1800" height="730" alt="ビフェ" class="img-responsive maximage" /> </div> </div> <a class="left carousel-control" href="#carousel-first-generic" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> </a> <a class="right carousel-control" href="#carousel-first-generic" data-slide="next"> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> </a> </div><!--カルーセル終わり--> <!--// カルーセル開始 //--> <div id="carousel-second-generic" class="visible-xs carousel slide" data-ride="carousel" data-interval="8000"> <!-- Indicators --> <ol class="carousel-indicators ind"> <li data-target="#carousel-second-generic" data-slide-to="0" class="active"></li> <li data-target="#carousel-second-generic" data-slide-to="1"></li> <li data-target="#carousel-second-generic" data-slide-to="2"></li> <li data-target="#carousel-second-generic" data-slide-to="3"></li> <li data-target="#carousel-second-generic" data-slide-to="4"></li> </ol> <!-- Wrapper for slides --> <div class="carousel-inner" role="listbox"> <!--// カルーセル1個目 --> <div class="item active"> <img src="http://www.画像(2018).jpg" width="780" height="730" alt="" class="img-responsive maximage" /> </div> <div class="item"> <img src="http画像.jpg" width="780" height="730" alt="" class="img-responsive maximage" /> </div> <div class="item"> <img src="h画像.jpg" width="780" height="730" alt="" class="img-responsive maximage" /> </div> <div class="item"> <img src="htt.jpg" width="780" height="730" alt="" class="img-responsive maximage" /> </div> <div class="item"> <img src="1.jpg" width="780" height="730" alt="" class="img-responsive maximage" /> </div> </div> <a class="left carousel-control" href="#carousel-second-generic" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> </a> <a class="right carousel-control" href="#carousel-second-generic" data-slide="next"> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> </a> </div><!--カルーセル終わり--> <div class="kaigyou"><br></div> <div class="web"> <a href="http/plan/" target="_blank"><img src="http.jpg" alt=""></a> </div> <div class="container-fluid text-center mrt30"> <img src="http://www.jpg" alt="!" /> </div> <div class="container-fluid text-center pm50"> <a href="http:/calendar/" target="_blank"><img src="http://www.jpg" width="520" alt="予" class="over"></a> </div> <div class="container-fluid"> <div class="container"> <div class="row topborder"> <div class="col-sm-3 col-xs-12 text-center menus"> <a href="<?php echo home_url(); ?>/concept/"> <div class="menupic"> <img src="<?php bloginfo('template_url'); ?>/.jpg" width="210" height="201" class="hidden-xs img-responsive m-maxwidth" alt=""> <img src="<?php b.jpg" width="640" height="380" class="visible-xs" alt=""> </div> <p class="hidden-xs"><br> </p> <button class="btn btngreen2"</button></a> </div> </div> </div> <?php //pagedに値をセットするのを忘れずに! $the_query = new WP_Query( array( 'paged' => get_query_var( 'paged' ) ? intval( get_query_var( 'paged' ) ) : 1, 'post_type' => 'post' , 'category__not_in' => 6, 'posts_per_page' => 4 ) ); ?> <?php if ( $the_query->have_posts() ) while ( $the_query->have_posts() ) : $the_query->the_post(); ?> <div class="news_box col-sm-3 col-xs-12 text-center"> <a href="<?php the_permalink(); ?>" class="thum" style="background:url(<? the_field('アイキャッチ') ?>);width:75%;height:0px;padding-bottom:75%;background-size:cover;display:block;margin:0 auto 20px;"></a> <a class="news_ttl" href="<?php the_permalink(); ?>"><? the_title() ?></a><br> <?php echo mb_substr(strip_tags($post-> post_content),0,55).'...'; ?> </div> <?php endwhile; ?> <?php wp_reset_postdata(); ?> </div> </div> <?php get_footer(); ?>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

macaron_xxx

2018/09/21 09:13

CSSがないとなんもわからん
m.ts10806

2018/09/21 09:29

「WordPress」をタグに入れられたほうが良いかと。独自の仕組みやプラグインとの兼ね合いも加味すると現在のタグの知識だけでは対応しきれない可能性が高いです。あと、コードブロックはソースコードだけにしていただけると。
Lhankor_Mhy

2018/09/22 01:26

『画像スライドの部分がパソコン用の大きさ(細さになってしまいます。)』とは、具体的にはどのような状況ですか? カルーセルが小さすぎる、ということですか?
satoshi1111

2018/09/22 09:25

mts10806 ありがとうございます。そうしてみます。
satoshi1111

2018/09/22 09:26

Lhankor_Mhy そうですね、縦に長いのが横になってしまいます。バナーを抜いたら元に戻ります。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問