Mobil grup sohbet temasını şekillendirmek için 8 CSS hilesi

Mobil grup sohbet temasını şekillendirmek için 8 CSS hilesi

CSS’yi kullanarak sohbet temalarınızı tasarlamak istediğinizde web sürümünüzü tasarlayabilirsiniz; bu, bilgisayarınıza, dizüstü bilgisayarınıza nasıl görüneceği anlamına gelir … burada nasıl yapılacağı bakın .

Mobil sürüm tamamen web sürümünden farklı olduğu için artık kendi özel mobil CSS tasarımını oluşturma seçeneği bulunmaktadır. ChatLaf, müşterilerin CSS kullanarak mobil grup sohbet temasını tasarlamalarına olanak tanıyan bir özellik sundu.

CSS ayarını kullanmak, CSS bilgisi olan müşteriler için mevcut olan gelişmiş bir özelliktir.

Sohbet temanızı değiştirmek için ChatLaf yönetim paneline giriş yapmanız gerekecek . Ardından , Gelişmiş Tasarım düğmesini seçip Mobil CSS sekmesini tıklamalısınız.

Müşterilerin mobil tasarımlarını kontrol etmeleri için istedikleri bazı genel püf noktalarını aşağıda görebilirsiniz.

Sohbet temasını Css ile Nasıl deiştireceğimize adım adım görelim

1. Bir konuk kullanıcısının varsayılan görüntüsünü css kullanarak değiştirme
Kullanıcı simgesi konuk Kendi resim URL’nizi kullanarak mobil grup sohbetinizin varsayılan konuk kullanıcısını herhangi bir resme değiştirebilirsiniz.

.user-imge
,. mesaj-kullanıcı-görüntüsü {
width: 0! important;
dolgu sağ – 32px;
background-image: url (“// ChatLaf-images-upload.s3.amazonaws.com/cc244d13c0e7e7bb6c4b63830314dc61/1444667334-usericon-blue.png”);
background-repeat: tekrarlama yok;
}

css ile kullanıcı görüntüsü değişimi

2. ADMIN resminin değiştirilmesi
Kullanıcı simgesi admin Kendi resim URL’nizi kullanarak varsayılan ADMIN kullanıcısını herhangi bir görüntüye değiştirebilirsiniz.

.admin. kullanıcı-görüntüsü,
.admin. mesaj-kullanıcı-görüntüsü {
background-image: url (“// ChatLaf-images-upload.s3.amazonaws.com/cc244d13c0e7e7bb6c4b63830314dc61/1444667334-usericon-white.png”);
}

2. ADMIN metin renginin değiştirilmesi
Varsayılan ADMIN metin rengini değiştirebilirsiniz.

.admin. mesaj-kullanıcı adı,
.admin. kullanıcı adı {
color: # 2DA8E0! önemli;
}

3. Üst Alt Çubuğu renginin değiştirilmesi

Mobil sohbetinizin üstbilgi ve altbilgi alanındaki rengi değiştirebilirsiniz.

.top-bar {background-color: # 3D5B9B! önemli; }
#bottom {background-color: # 3D5B9B! önemli; }

üstbilgi ve altbilgi renk değişikliği

4. Sohbet arka plan rengini değiştirme

Sohbet arka planını istediğiniz renkten beyaza değiştirebilirsiniz.

#chat {background-color: # 607D8B ! önemli; }

5. Arka plan resmi yükle

Mobil sohbet arka planınız olarak herhangi bir resmi yükleyebilirsiniz.

#chat {background: url (“// d1pfint8izqszg.cloudfront.net/images/skins/40000/background.jpg”) no-repeat sola kaydırma merkezi; }

sohbet arka plan rengini değiştir

6. Yazı tipi boyutunu değiştirin
Yazı tipi boyutunu kendi beğeninize göre değiştirebilirsiniz.

Kullanıcıların gönderdiği iletilerin yazı tipi:
#chat { font -size: 20px! important; }

Sohbet alanındaki kullanıcı adı fontu (mesajların yanında):
.message-kullanıcı-adı { font- size: 20px! important; }

Kullanıcılar listesindeki kullanıcı adı yazı tipi:
.user-name { font- size: 20px! important; }

Ayar düğmelerindeki yazı tipi:
# options-dd li bir açıklık { font -size: 20px! important; }
7. Menüdeki Düğmeleri Gizle
Düğmeleri mobil menü görünümünde gizleyebilirsiniz.

Tam Ekran Gizle düğmesi
.opt-tam ekran {ekran: yok; }

QR kodu düğmelerini gizle
.qr-li {display: none; }

Küçük boyutlu fontları gizle düğmesi
.opt-sm-font {display: none; }

Büyük yazı tipi düğmesini gizle
.opt-big-font {display: none; }

Konum düğmesini pin konumunda gizle
.pin-li {display: none; }

Ses kapalı / açma düğmesini gizle
.sound-li {display: none; }

8. Mesajın arka plan rengini değiştirme
Mesajın arka plan renginin değiştirilmesi, arka planın değiştirilmesi, metin renginin değiştirilmesi ve mesajdaki ipucunun değiştirilmesi (kullanıcı resmini işaret eden küçük üçgen) içerir.

.message-bubble {background-color: # 333333 önemlidir; }
.message-text {color: #ffffff! önemli; }

.main-message-container :: after {border-right-color: # 333333! important; }

 

Bir önceki yazımda « makalem var. Okumak istermisin ?
google'da paylaş
facebook'da paylaş
twitter'da paylaş
ETİKETLER :

Benzer Yazılar

Müşterinin Katılımını Artırmak için Mektup Yazısı Taktiklerini Sohbet ...

WordPress Üyeleri Eklentisine Bir Sohbet Odasını Nasıl Entegre ...

Daha Gizliliğe mi ihtiyacınız var Bir Grup Sohbetinden Özel Sohbet Odasına ...


YORUM



Bir Yorum Yazmak İstermisiniz ?