スマホ用サイトのロゴのサイズ設定について
フォーラム › テンプレート(テーマ) › スマホ用サイトのロゴのサイズ設定について
タグ: スマートフォン ロゴ サイズ
-
投稿者投稿
-
2014年8月3日 7:22 AM #71575Yoshi参加者
welthmesのminimumを使ってサイト制作途中の者です。
PCからロゴを登録後、スマホでサイトを見るとサイズが画面のレイアウトに合わず大きすぎてはみ出してしまっています。.sitename img {
height: auto;
max-width: 100% !important;
width: 100%;
}上記のコードをどこかに加えるとスマホでもサイズが自動で調整されるらしい、とまでは調べたのですが、どこに入れたら良いのか、私の状況でこの方法あっているのか見当がつきません。
アドバイスいただけますでしょうか。
2014年8月7日 3:45 AM #71631Yoshi参加者投稿者です。ご質問の方法、失礼致しました
上記情報の追記になります。WordPress のバージョン:Wordpress3.9.1
Welcart のバージョン:バージョン1.4.3
ご利用のテーマ:minimum バージョン1.63
症状を確認したブラウザ:safari
サーバー(会社名、サービス名):asuka NSO201プラン
SSLの利用:なし
WordPress のパーマリンク設定:おそらくデフォルトの状態です
——————————————–
PCよりロゴ画像をアップロード後、スマートフォンでサイトを確認したところ、ロゴ画像が画面のサイズに対し、比率が合わず、大き過ぎる状態で表示されてしまいます。
修正の為のコードの使い方を教えていただけるとありがたいです。
どうぞよろしくお願いいたします。2014年8月7日 11:10 AM #71632yasumaxキーマスターこんにちは。
有償テーマですので、私の方では検証できませんがセレクター名が違うのではないでしょうか?
セレクター名は「.sitename img」であっていますか?
一度ご確認ください。2014年8月7日 9:28 PM #71634Yoshi参加者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]–>よろしくお願いいたします!
2014年8月9日 7:07 PM #71646Yoshi参加者投稿者です。
こちらの件、なんとか解決することができました。
ご相談させていただき良かったです。ありがとうございました。
-
投稿者投稿
- このトピックに返信するにはログインが必要です。