1485 sujets

Web Mobile et responsive web design

Viewport

Bonjour,

Je reviens suite à un précédent Post.
Mon site location-balagne-lama.com est basé sur le thème Wordpress Shuttershot, il devrait être responsive mais sur ipad portait et mobile, le slider de la home ne l'est pas.

Un ami m'a fait changé le viewport dans header.php.
J'ai remplacé <meta name="viewport" content="width=device-width"> par <meta name="viewport" content="initial-scale=1, user-scalable=no">. Ca a réglé mon problème sur ipad portrait et sur iphone 6 plus mais pas sur Iphone 4S ni iphone 6 (je n'ai pas de 5 autour de moi), l'image de la home est toute petite en haut à gauche.

Pouvez-vous m'aider ?
Merci !!
Oui car j'ai réglé le slider sur 1 slide seulement. Je n'ai pas trouvé le moyen de mettre une image simplement en background sur la home, différente de l'image qui est sur toute les pages de contenu (qui elle est bien responsive).
Ce thème est mal fichu et je ne suis pas une pro du php mais s'il y avait moyen de mettre juste une image de background sur la home, ça résoudrait mon pb, quitte à ce qu'elle soit en dur dans home.php (c'est là que j'ai mis les 2 phrases de texte.
Moi j'ai enlever la balise <a> qui contient la balise <img>
et j'ai mis sur la <div> home-slider 

background-image: url('http://location-balagne-lama.com/wp-content/uploads/2015/02/Lama-CasaCosta1.jpg');
    background-size: cover;

Modifié par JENCAL (01 Apr 2016 - 13:44)
Tu peux m'expliquer un peu plus précisément ce que tu as fait pour contourner le pb dans home.php (je ne maîtrise pas trop le php) ?
Je viens de retirer le <a> dans home.php et ajouter ds ma css mais rien de mieux sur mon iphone 4 (tout est correct avec le débuggeur Chrome donc je ne sais pas si c'est un pb de cache ou pas.

Du coup, ds ma css, j'ai ajouté :
#home-slider {
	background-image: url('http://location-balagne-lama.com/wp-content/uploads/2015/02/Lama-CasaCosta1.jpg');
   	 background-size: cover;
}


Et le home.php devient (mais ça ne doit pas être suffisant)
<?php
/**
 * The template for displaying all pages.
 *
 * This is the template that displays all pages by default.
 * Please note that this is the WordPress construct of pages
 * and that other 'pages' on your WordPress site will use a
 * different template.
 *

 * @package fabframe
 */
 
get_header(); ?>

<div id="hblock">

<div id="home-slider">


<ul class="slides-container">
<?php

$slidecount = ft_of_get_option('fabthemes_slidecount','5');
$args = array( 'posts_per_page' => $slidecount, 'post_type'=> 'slides' );

$myposts = get_posts( $args );
foreach ( $myposts as $post ) : setup_postdata( $post ); ?>
	<li>
		<div class="title-slider">
			<h1>Casa Costa</h1>
		</div>
		<div class="text-slider">
			<p>Authenticité, nature, partage...</p>
		</div>		

		    <?php $img_url = get_post_meta($post->ID, "wtf_slider", true);	?>
		    
			<?php $elink = get_post_meta($post->ID, "wtf_extlink", true); ?>
			
			<?php $oldimg =  get_post_meta($post->ID, "wtf_slide", true);?>
			
			
				<?php if( $oldimg !=""){
					echo '<img src="'.$oldimg.'"/>';
				 } else {
				    echo wp_get_attachment_image( $img_url, 'full' ); 
				 } ?> 

		   

	</li>
<?php endforeach; 
wp_reset_postdata();?>

</ul>

</div>
</div>
<?php get_footer(); ?>


Merci pour ton aide !
Sujet clos
Aller à