Image d’arrière-plan étirée dans votre profil MySpace

Image d’arrière-plan étirée dans votre profil MySpace

Dimanche 8 mars 2009

Beaucoup de gens passent beaucoup de temps à personnaliser leur profil MySpace. Cela peut être très amusant. L’une des questions fréquemment posées est de savoir comment obtenir une image d’arrière-plan étirée sur le profil. J’ai un peu étudié cela et trouvé quelques solutions. Aucun d’entre eux n’est malheureusement entièrement parfait, mais ils peuvent être assez parfaits pour vous.

Notez que le problème d’arrière-plan étiré n’est pas limité aux pages MySpace. C’est un problème général pour toutes les pages Web. Il n’y a pas vraiment de bonne solution à cela aujourd’hui (printemps 2009). Nous devrons attendre la prise en charge de la propriété de taille d’arrière-plan CSS3. Si vous avez vous-même le contrôle total de la page Web (que vous n’êtes pas dans les profils MySpace), il existe des solutions de contournement, voir par exemple About.com .

Toutes les descriptions de mode d’emploi suivantes supposent que vous utilisez le profil MySpace 2.0.

Solution 1: Utilisez une grande image d’arrière-plan

Utilisez une image d’arrière-plan suffisamment grande pour remplir tout l’arrière-plan de la plupart des moniteurs.

Avantages

• Assez facile

Inconvénients

• Vous ne verrez jamais la taille du moniteur des téléspectateurs, donc l’image peut ne pas être assez grande de toute façon. Si vous optez pour 1920×1200, vous couvrirez au moins les grands moniteurs à écran large actuels.
• Un autre problème est que vous voulez vraiment que des parties spécifiques de l’arrière-plan soient visibles, assurez-vous donc qu’elles se trouvent dans la zone supérieure gauche de l’image.
• Parce que votre résolution de l’image d’arrière-plan est généralement assez grande, elle ne peut pas être hébergée sur de nombreux sites d’hébergement d’images populaires (cela inclut myspace lui-même et par exemple flickr), car ils ont une limite maximale de résolution, généralement environ 1027×768. Vous devrez donc héberger l’image ailleurs où la résolution peut être plus grande.
  Effectuez une recherche Google sur « hébergement d’images de grande taille » pour trouver des sites Web d’hébergement.

Comment

1. Télécharger une image d’arrière-plan suffisamment grande (par exemple 1920×1200) sur un site d’hébergement d’images où les images volumineuses sont autorisées.
2. Dans votre profil MySpace, activez le Profil > Personnaliser le profil.
3. Activer l’apparence > Édition avancée > Arrière-plan.
   • Entrez l’URL de l’emplacement de l’image hébergée, par exemple http://www.yoururl.com/images/myspacebg.jpg
   • Assurez-vous que Scroll with page est défini sur No et que
   • Repeat est défini sur Ne pas répéter.
4. Activez le bouton Aperçu pour afficher le résultat. Si satisfait, activez le bouton Publier.

Solution 2: Prise en charge préliminaire de CSS3

La plupart des navigateurs actuels (printemps 2009) ne prennent pas en charge la propriété de taille d’arrière-plan CSS3. S’ils l’avaient fait, tous les problèmes avec des arrière-plans étirés auraient été résolus. Cependant, la plupart des navigateurs utilisant le moteur webkit ont une prise en charge préliminaire de la propriété. Cela couvre par exemple les navigateurs Safari et Chrome.

Avantages

• Assez facile
• Peut utiliser n’importe quelle taille d’image, par exemple certaines de vos propres photos de profil.
• Effectuez un redimensionnement correct en s’étirant sur l’arrière-plan. Mais peut ne pas nécessairement bien paraître sur un moniteur ultra large.

Inconvénients

• Ne fonctionne pas dans Internet Explorer et dans de nombreux autres navigateurs. Cela couvre les navigateurs les plus utilisés, c’est donc un énorme inconvénient.

Comment

1. Dans votre profil MySpace, activez le Profil > Personnaliser le profil.
2. Activer l’apparence > CSS
3. Entrez le code CSS suivant – remplacez l’URL par l’emplacement de votre image:

body { background-image: url(http://www.yoururl.com/images/myspacebg.jpg); x-webkit-background-size:100% 100%;}

4. Activez le bouton Aperçu pour afficher le résultat. Si satisfait, activez le bouton Publier.

Solution 3: Injecter l’élément Img

La dernière solution, qui n’est pas encore parfaite, consiste à injecter un élément Img HTML dans votre profil, puis à contrôler sa position sur la page pour s’adapter à la fenêtre du navigateur.

Avantages

• Peut fonctionner avec n’importe quelle taille de résolution d’image, par exemple une image de vos albums de profil MySpace.

Inconvénients

• L’image défile avec la page, de sorte que l’arrière-plan n’est pas corrigé. C’est un énorme inconvénient.
• Un peu complexe à introduire dans votre profil.

Comment

1. Dans votre profil MySpace, activez le profil > Modifier le profil
2. Sur la page Modifier le profil, activez À propos de moi.
3. Dans la section À propos de moi, entrez les codes HTML suivants pour injecter l’élément Img qui fait référence à votre image d’arrière-plan. L’attribut src doit faire référence à l’image.

<img width="100%" src="http://www.yoururl.com/images/myspacebg.jpg"/>

1. Activez le bouton Enregistrer les modifications pour enregistrer vos modifications.
2. Activer le profil > Personnaliser le profil
3. Activer l’apparence > CSS
4. Entrez (ajoutez) le code CSS suivant – qui positionnera essentiellement l’image injectée (identifiée par) pour qu’elle s’insère en arrière-plan comme étirée:

#back{ width: 100%; height: 100%; left: 0px; top: 0px; position: absolute; z-index: -1;} 

5. Activez le bouton Aperçu pour afficher le résultat. Si satisfait, activez le bouton Publier.