スマホ用サイトのロゴのサイズ設定について
- このトピックには4件の返信、2人の参加者があり、最後に
により9年、 8ヶ月前に更新されました。
-
投稿
-
welthmesのminimumを使ってサイト制作途中の者です。
PCからロゴを登録後、スマホでサイトを見るとサイズが画面のレイアウトに合わず大きすぎてはみ出してしまっています。.sitename img {
height: auto;
max-width: 100% !important;
width: 100%;
}上記のコードをどこかに加えるとスマホでもサイズが自動で調整されるらしい、とまでは調べたのですが、どこに入れたら良いのか、私の状況でこの方法あっているのか見当がつきません。
アドバイスいただけますでしょうか。
投稿者です。ご質問の方法、失礼致しました
上記情報の追記になります。WordPress のバージョン：Wordpress3.9.1
Welcart のバージョン：バージョン1.4.3
ご利用のテーマ：minimum バージョン1.63
症状を確認したブラウザ：safari
サーバー（会社名、サービス名）：asuka NSO201プラン
SSLの利用：なし
WordPress のパーマリンク設定：おそらくデフォルトの状態です
——————————————–
PCよりロゴ画像をアップロード後、スマートフォンでサイトを確認したところ、ロゴ画像が画面のサイズに対し、比率が合わず、大き過ぎる状態で表示されてしまいます。
修正の為のコードの使い方を教えていただけるとありがたいです。
どうぞよろしくお願いいたします。yasumaxさん、アドバイスありがとうございます！
しかしすいません、お恥ずかしいのですが全くの初心者の為、どこに何を挿入するべきか自身で判断できない状態なんです。もしよろしかったらどなたか具体的に、どのコードをどこに入れるか示していただけませんでしょうか。以下はテーマ、ヘッダー編集の画面です。
<?php
/**
* <meta content=”charset=UTF-8″>
* @package Welcart
* @subpackage Welcart minimum theme
*/
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>><head>
<meta charset=”<?php bloginfo( ‘charset’ ); ?>” />
<meta name=”viewport” content=”width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no” />
<title><?php
/*
* Print the <title> tag based on what is being viewed.
*/
global $page, $paged;wp_title( ‘|’, true, ‘right’ );
// Add the blog name.
bloginfo( ‘name’ );// Add the blog description for the home/front page.
$site_description = get_bloginfo( ‘description’, ‘display’ );
if ( $site_description && ( is_home() || is_front_page() ) )
echo ” | $site_description”;// Add a page number if necessary:
if ( $paged >= 2 || $page >= 2 )
echo ‘ | ‘ . sprintf( __( ‘Page %s’, ‘twentyten’ ), max( $paged, $page ) );?></title>
<link rel=”profile” href=”http://gmpg.org/xfn/11″ />
<link rel=”stylesheet” type=”text/css” media=”all” href=”<?php bloginfo( ‘stylesheet_url’ ); ?>” />
<link rel=”pingback” href=”<?php bloginfo( ‘pingback_url’ ); ?>” />
<!–[if lt IE 9]>
<script src=”http://html5shiv.googlecode.com/svn/trunk/html5.js”></script>
<![endif]–>よろしくお願いいたします！
- このトピックに返信するにはログインが必要です。
PAGE TOP