Design Clean
    >> Tipps zum anpassen

Skype in rechter Box

Möglichkeit 1: Skype in rechter Box

In den Skype-Einstellungen müsst Ihr - Nachrichten von Jedermann - zulassen (bei Privatsphäre) , sonst können Eure Besucher keine Skype-Nachrichten schreiben.

Bild xFlensburger
Skype Nachricht


Am Ende dieser Seite findet Ihr weitere Möglichkeiten

Der HTML-Code

Den Code einfügen im Feld "erste rechte Box" bei "Designeinstellungen"
<p class="skype">
<a href="skype:Skypename?chat">
<img src="Grafikadresse" alt="Bild"> <span class="zeile1"> Vorname </span>
<br>
<span class="zeile2"> Skype Nachricht </span> </a>
<img class="skypelogo" src="https://img.webme.com/pic/c/clean-test/848544fc.png">
</p>
Lade ein Profilbild im Baukasten hoch und füge bei Grafikadresse die Bild-URL ein
Ersetze Skypename durch deinen Skype-Namen

Der CSS-Code

Den Code einfügen im Feld "Text ÜBER Design" bei "Designeinstellungen",
ODER im Feld "Eigener <head> - Inhalt" bei "Extras" :
<style type="text/css">
<!--

/* Aussehen Skype-Box */
p.skype { 
    width: 180px; 
    margin: auto;
    overflow: hidden; 
    background: #00AFF0;
    padding: 10px 10px 15px 10px; 
    border: 1px solid #777; 
    border-radius: 15px;
    box-shadow: 1px 1px 20px -3px #90AFF0;
}

/* Profilbild */
p.skype img { 
    width: 60px; 
    border-radius: 80px; 
    float: left; 
    margin-right: 20px; 
}

p.skype a { text-decoration:none; }

/* Aussehen Skype-Name */
a .zeile1 { 
    font-weight: bold; 
    font-size: 15px; 
    color: #FFFFFF; 
}

/* Schrift in Zeile 2 */
a .zeile2 { 
    font-size: 11px; 
    color: #FFFFFF; 
} 

/* Skype-Logo */
.skypelogo {
    position: absolute; 
    width: 25px!important; 
    margin-top: 8px; 
    padding: 2px; 
    background: #fff; 
    margin-left: -113px; 
}
-->
</style>

Rahmenfarbe ändern = bei border: | Schatten ändern = bei box-shadow: | Textfarbe = bei color:



Beachtet Bitte:
Um Fehler in der Darstellung zu vermeiden,
bitte erst die Probleme im Design Clean beheben !


kleine Skype Kontakt-Box :

mit Skypename oder Vorname, Homepage-Link, Anruf - und Chat-Link + Statustext:

xflensburger

flensbild.de

Anruf

Chat

Status:
chillen, - danach ausruhen


Der HTML-Code für den Seiteninhalt - ODER die Rechte Box
<div class="skypebox">
<p class="name"> Dein Vorname </p>
<p class="homepage"> <a href="Hier Homepage-Link">Linktext </a> </p>
<p class="anruf"> <a href="skype:Skypename?call"> Skype-Anruf </a> </p>
<p class="chat"> <a href="skype:Skypename?chat"> Skype-Nachricht </a> </p>
<hr class="linie">
<p class="skype-bild"> <img src="Grafikadresse" alt="Avatar"> </p>
<p class="status"> 
<strong>Status: </strong> <br>
Hier dein kurzer Status-Text </p>
</div>


Der CSS-Code :
kann mit in den Seiteninhalt (zu Beginn der Seite) eingefügt werden,
ODER im Feld "Eigener <head> - Inhalt" (findet Ihr bei "Extras")
<style type="text/css">
<!--

/* Skype-Box */
.skypebox {
     width: 180px;
     border: 8px solid #8CBEFF;
     border-radius: 5px;
     font-size: 13px;
}

/* Aussehen Text Zeile 1 Name */
.name {
    background: #378CF8;
    padding: 5px 0px 5px 10px;
    color: #FFFFFF;
    margin: 0px;
    font-weight: bold;
 }

/* Feld mit Homepage-Link */
.homepage {
    background: #DCDCDC;
    padding: 5px 0px 5px 10px;
    border-bottom: 8px solid #8CBEFF;
    margin: 0px;
}

/* Aussehen alle Links */
.skypebox a {
    font-weight: bold;
    font-size: 13px;
    font-family: arial;
    color: #378CF8;
    display: block;
    margin: 0px;
    text-decoration: none;
}

/* Position Anruf Button */
.anruf {
    float: left;
    margin: 0px;
    border-right: 3px solid #8CBEFF;
    overflow:hidden; 
}

/* Chat-Button  */
.chat { margin:0px; overflow:hidden; }

/* Blaue Trennlinie unter Buttons */
.linie {
    clear: left;
    margin: 0px -10px 0px 0px;
    width: 180px;
    background: #8cbeff;
    height:8px;
 }

/* Skype-Bild */
.skype-bild { 
    width: 160px; 
    margin: 10px auto; 
}

/* Feld mit Status-Text */
.status { 
    width: 160px; 
    margin:0px auto 10px auto; 
    overflow:hidden; 
}

/* Anruf und Chat Button */
.chat a, .anruf a {
    padding: 0px 25px;
    display: block;
    height: 33px;
    line-height:33px;
} 

/* HOVER Farbe Buttons */
.chat a:hover,  .anruf a:hover {
    color: #FFFFFF; 
    background: #7FC807; }

-->
</style>

Weitere Möglichkeiten für Skype

Link für Skype-Anruf / HTML-Code für Seiteninhalt oder Rechte Box:
<a href="skype:Skypename?call">Dein Linktext</a>
In deinen Skype-Einstellungen musst Du Anrufe von Jedermann zulassen


Link für Skype-Nachricht / HTML-Code für Seiteninhalt oder Rechte Box
<a href="skype:Skypename?chat">Dein Linktext</a>
In deinen Skype-Einstellungen musst Du Nachrichten von Allen zulassen


Skype-Button im Menü / Navigation :

Skype lässt sich auch in der Navigation verlinken :   >> Skype im Menü
Funktioniert in allen Baukasten-Designs (Iceblue / Red / Flexible / Professional u.s.w.)

eine weitere Möglichkeit

bietet Skype selbst an :   >> Skype-Button Generator

Skype Beispiel




Hier wurde die Seite https://clean-test.de.tl/nix.htm eingebunden.

- die Seite wurde in der Navi versteckt
- nur auf der Seite wurden alle div + table entfernt
- im Feld "Text UNTER Design" wurde dieser Inhalt eingefügt
- Inhalt wurde nur für diese eine Seite sichtbar gemacht
- so lässt sich auch eine Seite in der Mediabox aufrufen

Man muss darauf achten, das die Seite hier nur soviel Inhalt bekommt, wie diese Box auch an Höhe hat.

Wer mehr Infos dazu benötigt: Kontakt
clean-test.de.tl: Heute :105 Aufrufe



Auf "autostart" habe ich verzichtet. Klicke Play im Player.

nach Oben