VKontakte wiki işaretlemesi ile nasıl çalışılır. Avatar küçük resmine hangi bilgiler yerleştirilebilir. Birleştirilmiş bir avatar ve menü nasıl oluşturulur

Giderek artan bir şekilde iş yapmak, mal veya hizmet satmak için kullanılırlar. Bir grupla çalışmayı kolaylaştıran harika bir araç, wiki işaretlemesi kullanılarak oluşturulan bir menüdür.

Son zamanlarda, wiki listesini kullananların sayısı önemli ölçüde arttı. Sonuçta bu, gruba daha hoş ve estetik bir görünüm kazandırmanın harika bir yoludur ve ayrıca katılımcıların tüm bölümlerde daha kolay gezinmesine yardımcı olur.

Bu yazıda size bir grup için nasıl Vkontakte wiki sayfası yapılacağını, bir VK grubunda nasıl menü yapılacağını, hangi türlerin bulunduğunu, nasıl oluşturulacağını ve çok daha fazlasını anlatacağız.

VK metin düzenleyicisinin wiki işaretlemesini kullanma yeteneğine sahip olması nedeniyle tıklanabilir bir wiki sayfası oluşturmak mümkündür. Özel komutlar kullanarak resimler, bunlara bağlantılar, videolar ve diğer öğeleri eklemenize olanak tanır.

Liste, her bir mal/hizmet kategorisine veya topluluğun çeşitli bölümlerine/tartışmalarına (örneğin, portföy, nasıl sipariş verilir, şirket hakkında vb.) doğrudan bağlantılar oluşturmanıza olanak tanır. Herhangi bir kullanıcı sadece 1 tuşa basarak gerekli bilgileri bulabilir.

Bu çözüm, sıradan ziyaretçiler için bir yönlendiricidir ve topluluk için güzel ve şık bir tasarım olarak hizmet eder. etkileşimli bir araçtır ve insanlar mutlu olacak.

Ne yazık ki, VK geliştiricileri henüz halkın ana wiki sayfasına bir wiki listesi yerleştirme yeteneğini oluşturmadı (şimdiye kadar sadece yeni bir sekmede). Bu nedenle, insanlar bir menü içeren bir sayfaya yönlendiren ayrı gönderiler oluşturmaya ve yenilik yapmaya zorlanırlar.

Wiki menüsünün temel komutları ve özellikleri

Wiki sayfasının işlevselliği çok geniştir. Bununla menünüzü görsel olarak hoş, iyi okunabilir ve yapılandırılmış hale getirebilirsiniz.

Ne yazık ki, materyalimize kesinlikle tüm takımları sığdıramayacağız, bu yüzden sadece birkaçından bahsedeceğiz.

Medya dosyalarını kullanarak menü oluşturma

Özel düğmeler kullanılarak gerçekleştirilir.

Metin biçiminde medya dosyaları şunlardır: [​].

Medya XXXX_YYYY medya dosyasının kendisi olduğunda, seçenekler çeşitli ayarlardır (fotoğraflar ve videolar için), bağlantı, fotoğrafın/videonun üzerine geldiğinizde görüntülenecek olan resim yazısıdır.

Fotoğraf seçenekleri için:

Video için:

== işaretlerini kullanarak çeşitli düzeylerde başlıklar oluşturuyoruz

Başlığın başına ve sonuna "==" işaretleri ekleyin. Örnek için ekran görüntüsüne bakın:

VKontakte grubunun menü tasarımı için başlık metni ile çalışıyoruz.

Aşağıdaki metin seçeneklerini de kullanabilirsiniz: italik, kalın veya gri, üstü çizili veya altı çizili, üst simge veya alt simge. Metni ortaya veya sağa hizalamak da mümkündür. Aşağıda komutları içeren bir tablo bulunmaktadır:

Dikkat çekmek için tırnak kullanma

Etiketi kullanmak, birinin alıntısını güzel bir şekilde çerçevelemenize olanak tanır.

Listeler hem numaralandırılmış hem de madde işaretli olarak kullanılabilir.

Numaralandırılmış bir liste için, her yeni öğeden önce "#" sembolünü kullanın.

Madde işaretli bir liste için öncekine benzer, yalnızca “*” işaretiyle.

Girintilerle çalışma

Girinti yapmak için kelimenin önüne bir ":" ekleyin. Karakter sayısına bağlı olarak, girinti artar veya azalır.

Grup menüsündeki dahili bağlantılar

Bunlar iç sosyal kaynaklara bağlantılar. ağ "VKontakte" (bir kişiye, topluluğa, tartışmaya, uygulamaya, sayfaya, videoya ve resme bağlantı). Aşağıdaki yapı kullanılarak eklenirler: [].

VKontakte menüsünün oluşturulmasında dış bağlantılar.

Wiki işaretlemesi bir tablo menüsü oluşturur

Wiki sayfasını ve işaretlemeyi kullanarak da bir tablo oluşturabilirsiniz. Ekran görüntüsüne bakın:

bilgilendirici spoiler

Bununla, tek bir tıklama ile bilgileri gizli veya açık hale getirebilirsiniz. "Sıkça Sorulan Sorular" ile bir bölüm yapmanız gerekiyorsa çok uygundur.

İnşaat kullanılarak bir spoiler oluşturulur:

((Gizleyici|Spoiler adı
Metin
}}

Ve şöyle görünecek:

Böylece ekipler, tüm tasarım öğeleriyle eksiksiz bir liste oluşturmaya yardımcı olacaktır.

Menü türleri: bunlar nedir?

VKontakte'deki Wiki sayfaları farklı kriterlere göre ayrılabilir:

• Metin (yalnızca metin);
• Grafiksel (düğme resimleri, arka planlar vb. kullanarak).

Ekrana göre (kullanılan resme bağlı olarak):

• W örtülü (yapının kendisi görünmez);

• Aç (tüm öğeler aynı anda görünür);

• Bitişik veya ortak bir afiş ile (hem açık hem de kapalı olabilir).

Seçtiğiniz türden bağımsız olarak, hepsi aynı prensipte çalışır.

Ayrıca, bu türleri birleştirmek için korkmayın. Örneğin, önce düğmelerle (arka plan, stil, tasarım) bir grafik parçası yapabilir ve ardından çeşitli metin bilgileriyle tamamlayabilirsiniz (örneğin, spoiler kullanarak "Sık Sorulan Sorular").

Metin menüsü nasıl oluşturulur

Bir wiki sayfasındaki metin listesi daha az popüler ve daha basittir. Herhangi bir resim veya düğme içermez. Bu sadece bağlantı bağlantılarının bir listesi.

Aşağıda, bir VK grubu için metin listesinin nasıl oluşturulacağına ilişkin adım adım talimat verilmiştir:

1. İlk önce bir topluluk oluşturmanız gerekir. Bunu yapmak için "Topluluk Yönetimi"ne gidin ve "Bölümler" bölümünü seçin. "Malzemeler" satırını bulun, "Kısıtlı" öğesini seçin ve ayarları kaydedin.

1. Ayrıca, halkın ana sayfasında "Son haberler" görünecektir. Onlara gidin ve "Düzenle" yi tıklayın.

1. Bir başlık girin.
2. Aşağıda bir metin editörü VK bulunmaktadır. Listemizi burada oluşturacağız.
3. Aşağıdaki yapıyı kullanın:

Gerekli tüm noktaları yapın. Her yeni öğe yeni bir satırda. Burada yukarıda bahsettiğimiz çeşitli komutları kullanabilirsiniz.

Örneğin, basit ve küçük bir yapı yazacağız:

1. Kaydet'i tıklayın.

Burada başlığı vurgulamak için "==" işaretlerini ve alt öğeleri vurgulamak için "*" işaretlerini kullandık. Sonuç olarak, aşağıdakileri aldık:

Böylece, sadece birkaç adım attıktan sonra, her öğenin istediğiniz sayfaya hızlı bir şekilde gitmenizi sağlayacağı tamamen anlaşılır bir wiki menüsü elde ettik.

Hayal gücünüz ve wiki işaretleme olanakları yeterli olduğu sürece istediğinizi ekleyebilirsiniz.

Grafik menü nasıl oluşturulur

Bir grafik menüsü oluşturmak için, grafik düzenleyicilerle (Photoshop, GIMP, çeşitli uygulamalar vb.) çalışma konusunda en azından temel becerilere sahip olmanız gerekir. Bunlara sahip değilseniz, hazır şablonlarla profesyonellerin veya kaynakların yardımını kullanmanızı tavsiye edebiliriz (daha fazlasını okuyun).

Burada kendi başınıza bir wiki sayfası menüsünün nasıl oluşturulacağı hakkında konuşacağız. Aşağıda adım adım bir kılavuz bulunmaktadır:

1. Önceki talimatlardaki 1-3 arasındaki adımları izleyin.
2. Düğmelerle boş görüntüler oluşturmanız gerekir. Photoshop ve ağdaki diğer programlarla çalışma konusunda birçok ders olduğundan, grafik editörlerinde çalışmak hakkında ayrıntılı olarak konuşmayacağız.
   Aşağıdaki resimleri çekeceğiz.

Üç resim de büyük bir resmin parçasıdır. Bu nedenle, bir navigasyon oluşturduğumuzda, bu görüntüler üzerinde bulunan düğmelerle bir bütün resim gibi görünecektir.

1. Görüntüleri VKontakte metin düzenleyicisine yüklüyoruz.

1. Her resme tıklayarak, seçenekleri seçebilir ve bir bağlantı sağlayabilirsiniz.

1. Sağ tarafta görsel ve metin düzenleme modları arasında bir geçiş var.

1. Metin versiyonunda resimlerimiz şöyle görünür:

1. Resimler arasındaki mesafeyi kaldırmak ve kapatmak için "noborder" yazısını "nopadding" olarak değiştirin. Ve "|" işaretinden sonra bir bağlantı ekleyin.

1. "Sayfayı Kaydet"e tıklayın.

Sonuç olarak, bu menüyü aldık:

Biraz çaba ve ustalıkla, grubun genel tasarımına uyacak özgün bir tasarım oluşturabilirsiniz.

Nasıl düzeltilir

Oluşturulan wiki menüsünün topluluğun ana sayfasında görüntülenmesi için aşağıdaki adımları yapmanız gerekir:

1. Yeni bir gönderi oluşturun.
2. Menü bağlantınızı kopyalayın. Bunu yapmak için tekrar düzenlemeye gidin ve URL'yi tarayıcının adres çubuğundan kopyalayın.

Önce bir resim ekleyin, aşağıdaki resme bakın.

Şimdi yayını yayınlayın ve sabitleyin.

Burada görüntü üzerinde çok çalışmanız gerekecek. Neticede sürekli göz önünde olacak.Ayrıca halkın genel tasarımına uymalı ve kullanıcılara tıklayarak menüye yönlendirileceklerini söylemelidir.

nasıl silinir

Bir wiki menüsünü kaldırmak zor bir iş değildir. Basitçe "Topluluk Yönetimi", "Bölümler" bölümüne gidin ve materyalleri kapatın.

Sabitlenmiş bir gönderi kullandıysanız, kalacağını hatırlamak önemlidir. Bu nedenle, silinmesi (veya en azından sabitlenenlerden çıkarılması) gerekecektir.

Hazır şablonlar

Ayrıca, birkaç tıklamayla hazır şablonları indirebileceğiniz veya yenilerini oluşturabileceğiniz hizmetleri de dikkatinize sunmak istiyoruz.

• You-ps.ru, hazır wiki menü şablonları ve diğer hazır topluluk tasarım öğelerini içeren bir hizmettir.

• Vkmenu.com çevrimiçi bir tasarımcıdır. Kolay ve hızlı bir şekilde şık menüler oluşturmanıza olanak sağlar.

Ayrıca, bir profesyonelin işe alınması hazır çözümlere bağlanabilir. Bu durumda, her şeyi kendiniz yapmak zorunda değilsiniz, ancak ödemek zorunda kalacaksınız.

Sonuç

VKontakte topluluklarında wiki menüsünün ne olduğunu inceledik. Nasıl oluşturulacağını ve çeşitli komutları kullanmayı öğrendik.

Menünün henüz takdir edilmediğine inanıyoruz. Çok sayıda insan için bu "wiki işaretlemesi" çok karmaşık ve korkutucu bir şeydir. Üstüne almak bile istemiyorlar. Ama gerçekte, gördüğümüz gibi, her şey oldukça basit.

Denemekten ve özgün olmaktan korkmayın!

İş örnekleri yayınlayabileceğiniz, blog yazabileceğiniz ve hizmetlerinizin reklamını yapabileceğiniz bir yer mi almak istiyorsunuz? Genellikle bu amaçlar için bir web sitesi oluşturulur. Ancak daha basit bir çıkış yolu daha var - wiki işaretlemeli bir Vkontakte grubu. Bu yazıda nasıl oluşturulacağını anlatacağım.

Pratik yapın ve daha fazla pratik yapın! Süreci gerçek bir grup örneğinde anlatacağım - Fütüristik metin yazarlığı.

Vkontakte için yeni bir tasarımla çalışıyorum. Eskisi yakında modası geçecek - bu yüzden dikkate almayacağım. Her durumda, süreç çok farklı değil.

Yapmanız gereken ilk şey yeni bir grup oluşturmaktır:

• "Gruplar" bölümünü açın.
• "Topluluk Oluştur" düğmesine tıklayın.

Yeni bir topluluk oluşturuyoruz

• Başlığı girin. Herhangi birini belirtin - istediğiniz zaman istediğiniz kadar değiştirilebilir.
• Şimdi topluluk türünü seçin: grup veya genel sayfa. Fark yukarıda açıklanmıştır.

Grup mu yoksa genel sayfa mı?

• Topluluk Oluştur'u tıklayın.
• Burada belirtilen adı değiştirebilir ve sayfa türünü seçebilirsiniz (ayrıca istediğiniz zaman değiştirebilirsiniz).
• Site Kullanım Koşullarını kabul etmeyi unutmayınız.

Bir sayfa türü seçin

• Sayfa Oluştur'a tıklayın.

Yaşasın, topluluk oluşturuldu!

Topluluk Bilgilerini Düzenleme

Yeni bir grup oluşturduktan hemen sonra "Bilgileri Düzenle" sayfasına yönlendirileceksiniz. Burası ne:

• İsim. Açıklamanın gerekli olduğunu düşünmüyorum. Tek gerekli alan.
• Topluluk Açıklaması. Kendiniz ve grubunuz hakkında birkaç kelime yazın. Çok yazmaya değmez - kimse okumaz.

Ad dışındaki tüm alanlar boş bırakılabilir.

Daha fazla ayar

Ayarları tamamladığınızda "Kaydet"i tıklayın.

Grup oluşturuldu

Şimdi ana resmi yükleyebilirsiniz. Sağdaki "Fotoğraf Yükle" ye tıklayın.

Sayfa için bir resim yükleyelim

Görüntüdeki yolu belirtin. Logonuzu, fotoğrafınızı koyun veya oraya özel bir şey çizin (sipariş edin). Topluluğun ana resmi olacak alanı seçmek için çerçeveyi kullanın.

İstediğiniz alanı bir çerçeve ile vurgulayın

Şimdi grubunuzun küçük resmi olacak küçük bir yuvarlak alan seçin.

Dairenin boyutu da değiştirilebilir.

İşte bulduklarımız. Sayfa %35 daha çekici hale geldi!

Güzellik!

durumunu unutma. Orada da ilginç bir şeyler yazabilirsiniz. Örneğin, sloganınız veya iletişim bilgileriniz. Ya da bugün izin gününüz olduğuna dair bir duyuru.

Hazırlık çalışmasının bittiği ve en zor kısmın başladığı yer burasıdır - wiki işaretlemesi.

Grup kimliği nasıl bulunur

Bir menü, bir blog yazısı, çalışma örnekleri içeren bir liste - tüm bunları wiki sayfalarını kullanarak oluşturacağız. Vkontakte, yeni bir sayfa oluşturmak için araçları olmayan iğrenç bir hizmettir. Bunun yerine, komut dosyalarını kullanmanız gerekecek. Korkmayın, zahmetli de olsa basit.

Komut dosyası için grup kimliğinizi bilmeniz gerekir. Adresini değiştirmediyseniz, bunlar adres çubuğundaki "club" kelimesinden sonra gelen sayılardır. Zaten değiştim, bu yüzden kimliği almanın bu kadar kolay bir yolu benim için mevcut değil.

Açmak için duvardaki herhangi bir gönderiye tıklayın. Hiçbir şey yoksa, bir şeyler yazın. Herhangi bir şey.

Herhangi bir gönderi oluşturun ve üzerine tıklayın

Adres çubuğunda yeni veriler görünecektir. "duvar-" ve "_" (alt çizgi) arasındaki ortadaki sayfa kimliğinizdir. Bir yere kaydedin.

Kimliğim 124301131

Bir wiki sayfası oluşturun

Artık wiki işaretlemesi ile yeni sayfalar oluşturmak için komut dosyasını kullanabilirsiniz.

http://vk.com/pages?oid=-124301131&p=Ad

Bunu kopyalayın ve tarayıcınızın adres çubuğuna yapıştırın. Kimliğimi seninkiyle değiştir. Ve "Ad" kelimesi yerine oluşturulan sayfanın adını yazın. Rus dilini, boşlukları, sayıları kullanabilirsiniz. Ardından bağlantıyı takip etmek ve komut dosyasını çalıştırmak için Enter tuşuna basın.

Dikkat olmak! Bir wiki sayfasının adı değiştirilemez. Yazım hataları varsa, yeni bir tane oluşturmanız gerekecektir.

Önce ana sayfayı yapalım. Adını "Menü" koydum.

Komut dosyasını adres çubuğuna kopyalayın

İçerikle Doldur'u tıklayın.

Sayfa düzenleyicisini açın

İşte sayfa editörü. Ama şimdilik ona değil, bir bağlantıya ihtiyacımız var. Adres çubuğuna bakın. "?act=edit§ion=edit" kelimesine kadar her şeyi istiyorsunuz.

Sayfa kimliğini ve ona bir bağlantı kaydettiğinizden emin olun.

Bu çok önemli bir konu. Yeni sayfa henüz hiçbir yere sabitlenmedi ve hiçbir bağlantı ona yönlendirmiyor. Kapatırsanız kaybedersiniz.

Grubunuzun yapısını saklayacak ayrı bir dosya oluşturmanızı tavsiye ederim. "Başlık - bağlantı - sayfa kimliği" biçiminde yapın. Kimlik "page-124301131_50771728"dir. Yine de ihtiyacın olacak.

Örneğin, kulak misafiri grubumun yapısı burada. Menü ve 2 sayfa daha. Ayrıca yeni sayfalar oluşturmak için buraya bir komut dosyası attım. Bulmayı kolaylaştırmak için.

Kaybetmemek için tüm bağlantıları ve kimlikleri ayrı bir dosyaya kaydedin

Ya yalnızca sayfa kimliğini kaydettiyseniz, ancak bağlantıları unuttuysanız? Adres çubuğuna "https://vk.com/page-124301131_50771728" adresini girin. Doğal olarak, sayfanızın kimliğini değiştirin.

Wiki'yi bir gruba sabitleme

Ana sayfanın kendisini zaten oluşturdunuz. Şimdi toplumun en tepesinde sabitlenmesi gerekiyor. Bunu yapmak için, bağlantıyı sayfaya kopyalayın ve duvardaki bir mesaja yapıştırın. Vkontakte otomatik olarak bir düğme bağlantısı oluşturacak ve gönderinin altına ekleyecektir.

Bağlantıyı gönderideki sayfaya kopyalamanız yeterlidir

Metin bağlantısı kaldırılsa bile düğme kalacaktır

Bir görüntü yükle. Maksimum görüntü genişliği 510 pikseldir. Maksimum yükseklik de 510 pikseldir. Bu değerler içinde her şeyi yapabilirsiniz. 510x510 kare, yapabileceğiniz en büyük afiştir. Bu sadece sabitlenmiş gönderiler için değil, tüm gönderiler için geçerlidir.

şöyle bir şey yaptım

Gönder'i tıklayın. Şimdi gönderinin sağ üst köşesindeki üç nokta simgesine tıklayın. Ve "Sabitle" ye tıklayın.

Şimdi gönderiyi bir bağlantıyla sabitleyin

Aynı şekilde makaleleri wiki blogunuzda da duyurabilirsiniz. Sadece onları tutturmana gerek yok.

Sayfayı yenile. Grup bilgileri kayboldu. Bunun yerine, oluşturduğunuz bir gönderi, bir bağlantı ve bir resim ile ortaya çıktı.

Resme tıklamak ekli wiki sayfasını açacaktır

Resme veya "Görüntüle" düğmesine tıklarsanız, wiki sayfası açılacaktır.

Şimdiye kadar boş

Şimdilik ana konuya dokunmayacağız. Henüz diğer sayfalara sahip değiliz. Link verecek bir şey yok. Önce başka şeyler yapalım.

Vkontakte wiki sayfa düzeni

Mevcut tüm düzen etiketlerini açıklamayacağım. Her şey benden önce yazılmış zaten. Var resmi grup Vkontakte, wiki işaretlemesine adanmış. İçinde her şeyi bulabilirsiniz. Her şey konuya göre sıralanır - alın ve uygulayın.

Bu gruptaki bilgileri pratikte nasıl uygulayacağınızı size göstereceğim. Hakkımda sayfası oluşturalım. Başlamak için bir komut dosyası kullanarak oluşturun, kimliği yazın ve düzenleme sayfasına gidin.

Düzenleme sayfasında 2 mod vardır: normal ve işaretleme modu. Her nedense, olağan olan acımasızca hatalıdır - sürekli olarak bağlantıları koparır. Ve içindeki fonksiyonların çoğu mevcut değil. Bu yüzden çalışmamaya çalışıyorum. Wiki işaretleme moduna geçmek için simgeye tıklayın<>sağ üst.

Wiki işaretleme moduna geç

Hakkımda sayfasında neler olmalı? Bazı bilgiler, diğer metin yazarlarına göre avantajların bir listesi, belki bir fotoğraf. Haydi Yapalım şunu.

Önce metni yazın. Şahsen, favorime yazmak ve ardından Vkontakte editörüne kopyalamak benim için daha uygun. Her değişiklikten sonra "Sayfayı Kaydet"e tıklamayı unutmayın.

Şimdi bir fotoğraf ekleyelim. Kamera simgesine tıklayın ve görüntünün yolunu girin.

Araç çubuğundaki kamera simgesine tıklayın

İşte fotoğrafımız

Metnin görüntünün etrafına sarılmasını istiyorum, bu yüzden ona bir "sol" parametre ekleyeceğim. İnsanların fotoğrafın tam sürümünü açmasını istemiyorum, bu yüzden "nolink" özelliğini ekledim. Yukarıda bağlantı verdiğim gruptaki nitelikler hakkında daha fazla bilgi edinin.

"nolink" ve "sol" parametreleri ekleme

Sonucu görmek için - düğmesini kullanarak normal moda gidin<>.

çok güzel değil

Fotoğrafı küçültelim. İşaretleme modunda ihtiyacınız olan boyutları yazmanız yeterlidir. Değerleri orjinallerinin yarısı kadar belirttim.

Wiki düzeni modunda istediğiniz boyutları belirtin

Şimdi bir liste yapalım. Gerekli satırı vurgulayın ve liste simgesine tıklayın.

Bu düğme, bir liste öğesi oluşturan * etiketini koyar.

Başına bir "*" gelecek. Bu liste etiketidir. Manuel olarak ayarlayabilir veya araç çubuğundaki düğmeyi kullanabilirsiniz. Listenin geri kalanını kontrol edin.

zaten daha güzel

Şimdi başlıkları vurgulamamız gerekiyor. Araç çubuğunda H1-H3 başlıklarını tasarlamak için düğmeler bulunur.

Düğmeleri kullanın veya etiketleri manuel olarak ayarlayın

"Hakkımda" başlığını ilk seviye yapacağım. Ve listenin önündeki ifade üçüncü seviyededir.

Neredeyse bitti

Her şey neredeyse iyi, ancak ikinci başlık resimden biraz çıktı. Boş bir satır eklemeniz gerekiyor. Wiki işaretleme modunda bu, etiketi kullanılarak yapılır.
.

Boş satır ekleme

Yalnızca 1 satır atlamanız gerekiyorsa -
bunun için gerekli değil. Arka arkaya 2 veya daha fazla boş satır almak istiyorsanız kullanılır.

Belki bazı kelimeler kalın harflerle vurgulanabilir. İstediğiniz parçayı seçin ve "B" düğmesine basın veya Ctrl + B tuş kombinasyonunu kullanın.

Ctrl+B de çalışır

İşte sonunda olanlar.

bence iyi

Portföy yapma Vkontakte

Şimdi müşteriler için uygun bir portföy yapalım. 2 yol görüyorum:

• Ekran görüntüleri içeren albümler ve her birine bağlantı içeren bir liste sayfası oluşturun.
• Her iş için ayrı bir sayfa ve bir liste sayfası oluşturun.

Örneğin, portfolyoda 2 eser tasarlayacağım - her biri kendi tarzında.

portföy albümü

Bir albüm oluşturmak için Topluluğu Yönet menüsünü açın.

Topluluk ayarlarına git

Burada, "Fotoğraf Albümleri"nin yanındaki kutuyu işaretleyin. Şimdi onları oluşturabilirsiniz. Değişikliklerinizi kaydedin.

Fotoğraf albümleri içeren bir blok ekleyin

Topluluk sayfasında, "Fotoğraf ekle" düğmesini tıklayın ve istediğiniz dosyaların yolunu belirtin.

Çalışmamızın ekran görüntülerini albüme ekleyin

Diyelim ki ekrana sığmayan yazıların ekran görüntüsünü nasıl alırım ile ilgili portfolyoma bir yazı eklemek istiyorum. Bunu yapmak için makalenin ekran görüntüsünü alıyorum ve bir grafik düzenleyicide küçük parçalara ayırıyorum.

Ne için? Çünkü aksi halde resimdeki metin çok küçük ve okunamaz olacaktır. Böyle bir portföyden çok az anlam var. Ve böylece onu normal boyutta bir grup ayrı parçaya böldüm ve ayrı bir Vkontakte albümüne ekledim.

4 adet metin ve bir küçük resmim var. Herhangi bir resmin üzerine gelin ve "Fotoğrafı Taşı" simgesine tıklayın.

Yeni resimleri yeni bir albüme taşıyın

Yeni bir albüm oluşturun.

"Yeni Albüme" tıklayın

Albüme makaleyle aynı başlığı verin. Bulmayı kolaylaştırmak için. Açıklamaya ihtiyacınız yok. Ayrıca "Fotoğraflar yalnızca editörler ve yöneticiler tarafından eklenebilir" ve "Albüm yorumunu devre dışı bırak"ın yanındaki kutuları da işaretleyin. Albüm Oluştur ve Aktar'a tıklayın.

Albüme bir ad verin ve diğer kullanıcıların değiştirmesini önleyin

Kalan ekran görüntülerini de aynı şekilde aktarın. Ancak şimdi yeni bir albüm oluşturmanıza gerek yok - zaten var.

Listeden önceden oluşturulmuş bir albüm seçin

İşte bitirdik.

Metin parçaları içeren albüm

Sonraki albümler için transferle birlikte böyle bir hemoroid olmayacak. "Fotoğraf Albümleri" üzerine tıklayın.

Grubunuzun albüm listesini açın

Şimdi sağ üst köşedeki "Albüm Oluştur" düğmesine tıklayın. Bir ad verin ve "Fotoğraf Ekle" düğmesini kullanarak ekran görüntülerinin yeni bir bölümünü oraya yükleyin.

Portföydeki yeni metin için bir albüm oluşturun

İşte bu, şimdi 2 makalenin ekran görüntülerini saklayan 2 albümümüz var. Yeter, belki.

Ekran görüntüleri içeren 2 albüm

Bir Portföy sayfası oluşturun ve kimliğini not edin. Üzerine eserlerin kendilerini yerleştirmeyeceğiz - sadece başlıklar, küçük resimler ve kısa açıklamalar.

"Fotoğraf Ekle" simgesine tıklayın.

Sayfaya yeni resim ekleme

"Topluluk Fotoğraflarından Seç"e tıklayın. İstediğiniz albümü açın ve küçük resminizi seçin.

Albüme eklenen küçük resminizi bulun

Yeni bir sekmede albümü veya içindeki ilk ekran görüntüsünü açın. Ve bağlantısını kopyalayın (tamamen). Dikey çubuğun arasındaki fotoğraf etiketine eklemeniz gerekir | ve köşeli parantezleri kapat ]].

Semboller arasına bağlantı ekleyin | ve ]]

Böylece bir küçük resim alacaksınız, üzerine tıkladığınızda, istediğiniz albüm veya ekran görüntüsü metnin başlangıcıyla birlikte açılacaktır (bağlantıyı belirttiğiniz şeye bağlı olarak).

Portföy sayfası

Eh, burada her şey çok daha basit. Yeni bir wiki sayfası oluşturun ve kimliğini yazmayı unutmayın. "Fotoğraf Ekle" simgesine tıklayın ve metninizin önceden küçük parçalara ayrılmış bir ekran görüntüsünü yükleyin. İdeal olarak 1 resim - 1 paragraf.

Ne için? Çünkü Vkontakte görüntüleri oldukça güçlü bir şekilde sıkıştırır. Tam bir ekran görüntüsü yükler ve ardından tüm sayfayı dolduracak şekilde uzatırsanız, kalite korkunç olur. Küçük parçalar çok fazla acı çekmez.

Şimdi wiki işaretleme modunu kapatın (eğer açıksa).

Sonucu görmek için standart moda dönün

Fena değil, ama yeterli değil. İlk resme tıklayın. Açılan ayarlarda genişliği (sol hücre) 607 piksel olarak ayarlayın. Bu, bir sayfadaki görüntünün maksimum boyutudur. Yükseklik otomatik olarak değişecektir.

Görüntü genişliğini 607 piksele ayarlayın

İşte olanlar. Aynı şekilde, diğer tüm metin parçalarını artırın.

İlk parça gözle görülür şekilde daha büyük hale geldi

Böylece wiki sayfasına istediğiniz uzunlukta metin koyabilirsiniz. Ana şey, 607 piksel genişliğinde okunabilmesidir.

Wiki sayfasındaki metnin tam ekran görüntüsü

Son olarak, kaydettiğiniz sayfaların kimliklerine ihtiyacımız var. Portföy sayfanızı açın.

Bir küçük resim yükleyin (oluşturulmuş bir albümden veya bir bilgisayardan). Şimdi, kapanış köşeli parantezleri ]] ile dikey çubuk | arasına metin içeren sayfa kimliğini girin.

Semboller arasında metin içeren sayfa kimliğini kopyalayın | ve ]]

Aslında, her şey. Şimdi, küçük resme tıklandığında, ziyaretçi metin içeren sayfaya yönlendirilecektir.

2 bağlantı küçük resmimiz

Eser listesi yapmak

Şimdi portföyümüzü daha prezentabl ve kullanıcı dostu hale getirelim. Yayınlandığı siteye başlık, eser adları, küçük açıklamalar ve linkler ekleyeceğim. İşte olanlar.

Her iş hakkında biraz bilgi ekleyin

"Hizmetler ve fiyatlar" sayfasının yapılması

Halihazırda bir Hakkında sayfamız ve güzel bir portföyümüz var. Belki de müşterilere fiyat etiketini göstermenin zamanı gelmiştir. Tablo şeklinde düzenlemeyi düşünüyorum. Basit ve net. Yeni bir wiki sayfası oluşturun, kimliği kaydedin - ve gidelim.

Bir tabloyu düzenlerken ihtiyaç duyulan tüm etiketler hakkında daha fazla bilgi edinebilirsiniz.

VKontakte sosyal ağını kullanarak mal satmak veya hizmet sunmak isteyen herkes, topluluklarını kaydettirmelidir. VKontakte sosyal ağında bir şeyler satmak amacıyla oluşturulan gruplar zaten var büyük miktar. Grubunuzu nasıl benzersiz ve çekici hale getirebilirsiniz? Diğer toplulukların arka planından nasıl sıyrılabilir ve müşteriyi sizden mal almaya nasıl ikna edebilirsiniz? Bunu yapmak için VK topluluğunuzu güzel ve alışılmadık bir şekilde tasarlamanız gerekir. Wiki işaretlemesi bu konuda yardımcı olacaktır. Size aptallar için VKontakte wiki işaretlemesinin ne olduğunu söyleyeceğiz.

Okuyucular için indirim

Şanslısınız, smmbox.com hizmeti indirimler veriyor.
Bugün %15 indirim hizmeti kullanmak için. Ödeme yaparken sadece kayıt olmanız ve promosyon kodunu girmeniz yeterlidir. smmbox_blog

Wiki işaretlemesi. Bu ne

VKontakte wiki işaretlemesi, VK topluluğunun eğitim, satış veya eğlenceli Web sayfalarını tasarlamak için oluşturulmuş özel bir dildir. Bu, ek VKontakte işlevselliğini bağlamanıza ve bir grubu tanıtmak ve benzersiz kılmak için kullanmanıza izin veren çok değerli ve güçlü bir biçimlendirme dilidir.

Wiki işaretlemesi kullanılarak tasarlanan veya oluşturulan sayfalara wiki sayfaları denir. Terim ilk olarak 1995 yılında Ward Cunengham tarafından tanıtıldı. Ardından İnternet kullanıcıları Wikipedia ile tanıştı. "Wiki" Hawaii dilinde "hızlı" anlamına gelir.

Wiki işaretlemesi, güzelce tasarlanmış öğeleri hızlı bir şekilde oluşturmanıza ve herhangi bir topluluk sayfasının koduna yerleştirmenize olanak tanır, örneğin:

• düğme menüsü;
• bağlantı resimleri;
• spoiler;
• çapalar;
• küçük oyunlar.

Bir wiki biçimlendirme spoileri, mavi yazıtlı bir düğmenin arkasına gizlenen metindir, tıkladıktan sonra metin görünür hale gelir.

VKontakte wiki işaretlemesi, HTML'ye (Hyper Text Markup Language) çok benzer. Ancak, siber metin biçimlendirme dilinden farklı olarak, grafiksel bir arayüz sayesinde bir hafta içinde ustalaşılabilir.

Bu işaretleme, grubu yönetme olanaklarınızı önemli ölçüde genişletecektir. Bununla çevrimiçi dergiler, çevrimiçi mağazalar ve hatta mini siteler oluşturabilirsiniz.

Ek olarak, wiki işaretlemesinin büyük bir artısı, topluluk sayfasında şimdiye kadar yapılmış tüm değişikliklerin VK sunucularında saklanması ve istediğiniz zaman tasarım seçeneklerinden birine geri dönebilmenizdir.

Bir wiki sayfası nasıl oluşturulur

Bir wiki sayfası oluştururken aşağıdaki plana bağlıyız:

• Sayfanın türüne karar verin ve düzenini yapın. Bu türler vardır: VK-iniş, VK-post, etkileşimli sayfa.
• Mini sitenizin görünümüne karar verdikten sonra bir wiki sayfası oluşturmaya başlayabilirsiniz. Menü oluştur, menü butonlarını aktif hale getirin. Sayfaları içerikle doldurun. Ürünlere bağlantılar oluşturun. Video veya ses kayıtlarını ve daha fazlasını bağlayın. Her şey hayal gücünüze bağlı.
• Topluluğu sanatsal olarak dekore edin. Resimler, logolar, avatarlar, ürün fotoğrafları ekleyin…
  Mevcut bir grubun arayüzünü wiki işaretlemesini kullanarak tasarlamanın özel bir örneğini göstereceğiz. Bir test topluluğu oluşturalım ve tüm süreci adım adım inceleyelim.

Bir wiki sayfası oluşturmak için bağlantıyı tarayıcının arama çubuğuna kopyalamamız gerekiyor. https://vk.com/pages?oid=-***&p=NAME.

*** yerine benzersiz bir topluluk kimliği eklemeniz gerekir.

Bizim durumumuzda, bu 105722542'dir.

Kimlik, /club'dan sonra tarayıcının adres çubuğunda bulunur; /event veya /public.

"NAME" yerine - örneğin "ürün kataloğu" gibi wiki sayfasının adına sürün.

Lütfen adın değiştirilemeyeceğini unutmayın.

Menü bölümümüze daha fazla erişim için, vurgulanan bağlantıyı bir metin belgesine kopyalayıp kaydettiğinizden emin olun.

Wiki işaretleme moduna geçmek için "Düzenle" düğmesine ve ardından "Wiki işaretleme modu"na tıklayın.

İşaretleme modunda, aşağıdaki kodu çevirmeniz gerekir.

(|nomarj*** bu komutla sınırları kaldırın
|- *** yazıtlar oluşturmaya başlayın
|

ev *** "Ev" yazısını oluşturun ve dikdörtgenin ortasına hizalayın
|katalog *** "ürün kataloğu" yazısını oluşturun ve dikdörtgenin ortasına hizalayın
|Hakkımızda *** "hakkımızda" bir yazıt oluşturun ve dikdörtgenin ortasına hizalayın
|kişiler *** "kişiler" yazısını oluşturun ve dikdörtgenin ortasına hizalayın
|} *** yazıt bloğunu kapat
[[Ev]]*** "Ev" için bir bağlantı oluşturun
[[Hakkımızda]]*** "Hakkımızda" için bir bağlantı oluşturun
[[kişiler]]*** "Kişiler" için bir bağlantı oluşturun
________________________________________
***Not

Onları "?" ye kopyalıyoruz. Her sayfada bitmesi gereken şey budur.

Ana sayfa kodu

https://vk.com/page-105722542_54261370

***(Ürün kataloğu) |

https://vk.com/page-105722542_54261943

*** (Hakkımızda) |

***(Hakkımızda) |

https://vk.com/page-105722542_54261944

*** (Kişiler) | )

***(Kişiler) |)

***Not

Kalan menü düğmeleri “ana sayfa” koduna benzer şekilde tasarlanmıştır.

Tüm değişiklikleri her sayfada kaydederiz.

Her zamanki moddaki bölümlerden herhangi birine gidiyoruz, önceden kaydedilmiş bağlantıyı metin belgesinden tarayıcı satırına kopyalıyoruz.

Menü öğesi görünene kadar bekleriz. Bundan sonra, bağlantı silinmeli ve "gönder" düğmesine tıklanmalıdır. Düğmenin yanında, "Topluluk adına" seçeneğini seçin.

Her menü sayfası metinle doldurulmalıdır. Bundan sonra süslemeye başlayabilirsiniz.

Bir başlık ve bir avatar ekleyelim.

Bunları video eğitiminde yapabilirsiniz

Aptallar için VKontakte wiki işaretlemesinin ne olduğunu size gösterdik. Onunla bir topluluk tasarlamak çok heyecan verici. Wiki işaretlemesini öğrenin ve gerçek mini siteler oluşturun.

.

VKontakte topluluğunun güzel tasarımı bir heves değil, kullanıcıların size ve şirketinize olan güvenini oluşturan önemli bir unsurdur. Herkese açık bir sayfa veya grup profesyonel olmayan bir şekilde tasarlanmışsa, potansiyel müşterileriniz oldukça mantıklı bir şekilde işinizde de ihmalkar olduğunuz sonucuna varabilir. Bunun olmasını önlemek için VKontakte sayfanızın güzel, düzenli ve kullanımı kolay olduğundan emin olun. Nasıl yapılır? Alttarafı oku.

Görüntülerin gerçek boyutları "VKontakte"

Bir süre önce, sosyal ağ VKontakte'nin geliştiricileri yeni bir tasarım başlattı. Bu, görüntüleri gösterme boyutlarının ve ilkelerinin değişmesine neden oldu. Aşağıda verilecek olan not, tüm yeniliklere tekabül etmekte ve verilen zamanda ilgili boyutları içermektedir.

Şimdi her bir öğeye daha yakından bakalım.

VK avatar boyutu

Bir avatarın minimum boyutu 200 x 200 pikseldir. Genişliği veya uzunluğu 200 pikselden az olan bir resim yüklemeye çalışırsanız şu hatayı görürsünüz:

Bir avatarın maksimum boyutu 200 x 500 pikseldir. Ancak prensipte daha büyük resimler yükleyebilirsiniz - her iki tarafta 7000 piksele kadar. Ana şey, kenarlarının oranının 2 ila 5'i geçmemesidir.

Size bir örnekle göstereceğim.

bir imajım var. Boyutu: 200 x 800 piksel (2 ila 8 oran). Yüklerken herhangi bir hata yok. Ancak yine de bu resmi kullanamıyorum çünkü "İletişim" tamamen seçmeme izin vermiyor.

Örtmek

Sitenin tam sürümü için kapak boyutu 1590 x 400 pikseldir.

Lütfen dikkat: mobil sürümde ve uygulamalarda, kapağın tam sürümü gösterilmez, yalnızca 1196 x 400 piksel boyutunda bir kısmı görüntülenir. Mobil uygulamada nasıl kırpıldığını görün:

Bunun olmasını önlemek için, kapağınızın ana öğelerini 1196 x 400 piksel arasında konumlandırın.

Ekli resimler

"İletişim" in güncellenmiş tasarımında haber akışının genişliği sabitlendi. Bu, gönderiye eklenen resimlerin artık uzatılmadığı, oldukları gibi kaldığı anlamına gelir. Bu nedenle, görselinizin Haber Kaynağı'ndaki tüm alanını doldurmasını istiyorsanız, en az 510 piksel genişliğinde olmalıdır. Yatay yönde kare veya dikdörtgen olması en iyisidir.

Biraz kafa karıştırıcı geliyor :) Bu yüzden size bir örnekle göstereceğim.

Diyelim ki kenarları 510 piksel olan kare şeklinde bir görüntümüz var. Gönderimize sabitlersek, tüm cihazlarda haber akışında harika görünüyor:

Ve yatay bir görüntü yatay yönde böyle görünür (genişlik 510 piksel):

Gördüğünüz gibi, görüntü ne kadar darsa (yükseklik olarak), akıllı telefon beslemesinde o kadar küçük görünüyor. Bunu doğrulamak için aşağıdaki resme bakın:

Buradaki farkın özellikle kritik olmadığı açıktır ve akıllı telefon kullanıcıları yine de görüntünüzü dikkate alacaktır, sadece ikinci durumda biraz daha rahat olacaklardır.

Bağlantılı gönderiler için resimler

Tüm bu veriler Açık Grafik işaretleme kodundan alınmıştır:

Open Graph belirtilmezse başlık, Title meta etiketinden, resim ise makaleden alınır. Aynı zamanda, kolayca değiştirebilir veya özel okları kullanarak makaleden başka bir resim seçebilirsiniz:

Veya kendinizinkini yükleyin:

Makaleniz için duyuru olarak kullanabileceğiniz minimum resim boyutu 537 x 240 pikseldir. Ancak, en boy oranına saygı duyulduğu sürece daha büyük resimler yükleyebilirsiniz.

Editörde oluşturulan bir makalenin resmi

Editörde oluşturulan bir makalenin kapağı için resim boyutu 510 x 286 pikseldir. Koyu renkli ve az çok tek renkli olması daha iyidir, çünkü makalenin ve topluluğun adı açık bir arka planda kaybolur.

İyi örnek:

Pek iyi bir örnek değil:

Hikayeler için fotoğraf ve video boyutu

Fotoğrafların boyutu 1080 x 1920 pikseldir. Video boyutu 720 x 1280 pikseldir.

Özellikler videolar için:

• 15 saniyeye kadar;
• en fazla 5 MB;
• h.264 kodlayıcı;
• AAC sesi.

Hikayelerde, fotoğrafları ve videoları dikey biçimde kullanmalısınız.

Lütfen unutmayın: Şu anda topluluklar adına hikayeler yalnızca VKontakte geliştiricilerinin bu özelliği açtığı büyük topluluklar tarafından eklenebilir. Ve bu resmi başvuru kullanılarak yapılır. Bilgisayardan yapılamaz.

Fotoğraf albümü kapak boyutu

Video resmi boyutu

1280 x 720 piksel.

Wiki sayfası

Wiki içerik alanı 607 piksel genişliğindedir. Daha büyük bir resim yüklerseniz, otomatik olarak 400 piksel genişliğinde yüklenir. Örnek: 1366'ya 768 olan bir resmim var. Bir wiki sayfasına eklersem şöyle görünür:

Resmin boyutunu değiştirmek için üzerine tıklamanız ve istediğiniz değerleri ayarlamanız gerekir:

Wiki sayfaları ile nasıl çalışılır, aşağıda detaylı olarak anlatacağım. Bu nedenle burada bu nokta üzerinde durmayacağız.

VKontakte görüntülerinin küçülmediğinden nasıl emin olunur? Arka plan ve boyutun resim kalitesine etkisi.

VKontakte'ye resim yüklemeyi denediyseniz (ister bir avatar resmi, isterse sadece seyahatinizden bir fotoğraf olsun), muhtemelen küçülme eğiliminde olduklarını zaten biliyorsunuzdur. Bu, özellikle koyu (ve özellikle kırmızı) bir arka planda ve resim çok büyük olmadığında fark edilir. Örnek:

Resimlerin kalitesinin bozulmadığından nasıl emin olunur?

Görüntünün küçülmemesi için (daha doğrusu küçülür, ancak çok daha az ölçüde), istenen boyuttan 2-3 kat daha büyük yapmak gerekir. Örneğin 200 x 500 piksel boyutunda bir avatar yapmamız gerekiyorsa 400 x 1000 piksel boyutunda bir resim çekiyoruz. 510 x 400 piksel boyutunda bir menü yapmanız gerekiyorsa, - 1020 x 800 alırız.

Yukarıda gösterdiğim lacivert zemin üzerindeki resim 510x350. Onu iki katı (1020x700) büyüttüm ve kaydettim. Oradan şu çıktı:

Nasıl düzeltilir? Cevap çok basit - farklı bir arka plan seçmeniz gerekiyor. Gerçek şu ki, pikseller karanlık bir arka plan üzerinde açık bir arka plandan daha görünür. Bu nedenle, mükemmel kalite elde etmek istiyorsanız (yukarıdaki resim zaten oldukça normal görünse de), renk şemasını biraz değiştirmeniz gerekir. Örneğin, arka planı beyaz ve metni mavi yapın:

Sayfa başlığı nasıl tasarlanır

Genel sayfanızın veya grubunuzun başlığı, kullanıcıların sizi ziyaret ettiklerinde gördükleri ilk şeydir. Çoğu durumda, genel materyallere dayalı bir gezinme menüsü, bazı ilginç gönderiler veya önemli duyurular bu yere yerleştirilir. Farklı şirketlerin bu alanı nasıl kullandıklarına dair örneklere bakalım.

Örtmek

Çok uzun zaman önce, VKontakte bir güncelleme yayınladı - şimdi sayfalara büyük ve güzel kapaklar (1590 x 400 piksel) yükleyebilirsiniz. Bunu yapmak için ayarlara gidin ve "İndir" düğmesini tıklayın.

Kapağa her şeyi koyabilirsiniz: şirketinizin adından ve sloganından her türlü promosyona, teklife ve hatta yarışmaya kadar.

Dinamik kapak olanaklarına özellikle dikkat etmenizi öneririm. Nasıl çalıştığı, hangi amaçlarla kullanılabileceği ve hangi hizmetlerle kurulacağı hakkındaki makalemizi okuyun.

Dinamik kapak örnekleri:

Kapak + topluluğun açıklaması + siteye bağlantı

Bazı şirketler özellikle başlıktaki herhangi bir gönderiyi düzeltmezler, böylece kullanıcılar sayfayla ilgili temel bilgileri okuma ve hemen siteye gitme fırsatı bulurlar.

Hashtag'li açıklama

Bazı şirketler, onu karakterize eden sayfanın standart açıklamasına hashtag'ler ekler. Bu, sayfanın daha net bir alaka düzeyine sahip olması için yapılır ve bu nedenle, alakalı sorgular için aramada daha yüksektir. Dürüst olmak gerekirse, bu yöntemin işe yarayıp yaramadığını bilmiyorum. Bu konuyla ilgili vakalar görmedim, bu yüzden bilen varsa, bağlantıyı paylaşırsa minnettar olacağım.

Sayfanın ne hakkında olduğunu anlatan sabitlenmiş gönderi

Sayfanız hakkında daha ayrıntılı bilgi vermek istiyorsanız (fotoğraflar, bağlantılar ve güzel bir düzen ile), o zaman bir wiki yazısı veya editörde yapılmış bir makaleyi, duyuruda kullanıcıları teşvik edecek parlak bir resim ile başlığa ekleyebilirsiniz. üstüne tıkla. Böyle bir gönderiye bir örnek:

Ve işte kullanıcının bağlantıya tıkladıktan sonra gördüğü şey:

Grup menüsü açık

Açık bir menüye, hangi öğelerden oluştuğunu hemen gösteren böyle bir menü diyorum. Yani, wiki gönderisinin resimli duyurusu içeriğini tamamen kopyalar. Böylece kullanıcılar içeride kendilerini neyin beklediğini hemen görürler. Size bir örnekle göstereceğim.

Bir Flatro sayfasının başlığında sabitlenmiş bir gönderi şöyle görünür:

Grup menüsü kapatıldı

Kapalı bir menü, önceki paragraftakiyle aynı wiki gönderisidir, yalnızca duyuruda menü öğesi olmayan bir resim bulunur. Genellikle üzerine yazarlar: “Menü”, “Gezinme menüsü” veya “Genel materyallerde gezinme”.

Tıkladığımızda gördüğümüz şey:

Bu arada, bunların tek seçenek olmaktan uzak olduğunu belirtmekte fayda var. Aslında bu resim üzerine istediğinizi yazabilirsiniz. Ana şey, kullanıcının tıklamak istemesi ve bundan sonra onu neyin beklediğini anlamasıdır. Örnek:

Grup menüsü

Birleştirilmiş menü, menünüzün duyurusundaki resmin avatarla tek bir resim olduğu zamandır. Biraz daha aşağıda size böyle bir menüyü nasıl yapacağınızı detaylı olarak anlatacağım ama şimdilik sadece ne kadar güzel göründüğüne bakın.

GIF ve avatar tek görüntüde

Ama bu şapka tasarımı beni gerçekten çok etkiledi. Otomatik oynatılan bir gif, avatarla tek bir kompozisyonda birleşir ve hakkında hiçbir bilgi olmamasına rağmen kullanıcıların dikkatini çeker.

Bu arada, bu örneği SMM pazarlamacısı Sergey Shmakov'un grubunda gözetledim. Bu yüzden, bulduğu için ona teşekkür ederim :)

Gizli menü

Gizli menü yalnızca gruplar için kullanılabilir (sayfalarda böyle bir işlev yoktur). Görmek için ilgili bağlantıya tıklamanız gerekir. Bu tasarım yönteminin avantajı, kullanıcıların topluluğa ait temel bilgileri görebilmeleri ve menüyü kullanmak isterlerse tek bir tıklama yapmaları yeterlidir. Ancak, burada küçük bir dezavantaj var - tüm kullanıcılar bu özelliğin varlığından haberdar değil, bu nedenle menünüz sayfanın en üstüne sabitlendiğinden daha az dikkat çekebilir.

videoyu otomatik oynat

Kasım 2015'in sonunda, VKontakte sosyal ağında ilginç bir yenilik ortaya çıktı - bir kullanıcı sayfanıza girer girmez başlığa eklenen video otomatik olarak oynatılmaya başlar. Bu teknikle, kullanıcıların (özellikle sayfanızı ilk ziyaret edenlerin) daha da fazla dikkatini çekebilir ve aynı zamanda, içeriği kendilerine empoze edildiğinde beğenmeyenleri rahatsız etmez, çünkü video sessiz oynatılır. ve pratik olarak karışmaz.

Bu videoyu sayfanızın başlığına nasıl eklenir?

Bunu yapmak için üç koşulun karşılanması gerekir:

• Bir gönderiye bir video ekleyin ve bu gönderiyi topluluğun en üstüne sabitleyin.
• Videoya ek olarak, girişe başka hiçbir şey eklenmemelidir. Yalnızca video ve metin isteğe bağlıdır.
• Video VKontakte tarafından yüklenmelidir - üçüncü taraf oynatıcılar desteklenmez.

Çok sayıda yeniden gönderi alan bir gönderi

Sayfanızın başlığındaki alanı verimli bir şekilde kullanmanın bir başka yolu da, en başarılı gönderilerinizden birini - zaten çok sayıda beğeni ve paylaşım kazanmış ve kazanmaya devam eden bir gönderiye sabitlemektir. Bunu neden yapıyorum, sanırım herkes anlıyor - ne kadar çok gönderi, kapsam o kadar büyük, sayfa o kadar çok abonelik alıyor.

Yeni kliplerin, albümlerin, etkinliklerin duyuruları

Yeni ürün/hizmetlerin tanıtımı

İndirimler ve promosyonlar

Vakalar, müşteri yorumları

Uygulama reklamcılığı

Pratik şakalar

Topluluk Kuralları

Diğer sosyal ağlara bağlantılar

Kapak için tüm tasarım seçeneklerinden çok uzakta listeledim. Aslında, kapakta ve sabitlenmiş gönderide herhangi bir bilgiyi yayınlayabilirsiniz: işler, duyurular, en çok satan ürünlere bağlantılar vb. Bu yüzden kendinizi yukarıdaki örneklerle sınırlamayın. Hayal gücünüzü açın ve hedeflerinize ulaşmak için topluluğunuzun tasarımını kullanın.

avatar ne olmalı

Bir avatar sadece şirket logonuzla güzel bir görüntü değil, aynı zamanda bir pazarlamacı için hedeflerine ulaştığı bir çalışma aracıdır. Kullanıcıların dikkatini çekmek ve onları hedef eylemi tamamlamaya teşvik etmek için nasıl olması gerektiğine daha yakından bakalım. Küçük resimle başlayalım.

Avatar küçük resmi

1. Avatar küçük resmindeki metin, okunabilecek kadar büyük olmalıdır.







2. Metin, küçük resmin ötesine geçmemelidir.







3. Kullanıcılar, profil resminde ne gösterildiği konusunda net olmalıdır.







4. Mümkünse, genellikle şirketin güvenilirliğini azalttığı için stok görselleri kullanmamak en iyisidir.




5. Avatar küçük resminin çok soluk ve sıkıcı olması istenmeyen bir durumdur, aksi takdirde daha parlak rakip avatarların arka planında kaybolacaktır.



6. Avatarınızın modern görünmesini istiyorsanız, minimalist bir tarzda yapın: daha az metin, gölgeler, degradeler ve anlamsal anlam taşımayan öğeler. Avatarınız mümkün olduğunca basit ve temiz olmalıdır. Bu tarz şu anda trend.







7. Amacınız kullanıcıların dikkatini çekmek ve feed'deki diğer avatarlardan sıyrılmaksa, hayal gücünüzü açmanız gerekecek. İlginç topluluklar ararken neye dikkat ettiğinizi düşünün? Burada, örneğin, genellikle yeni bir mesajın geldiğini gösteren yanan bir ışıkla avatarlardan birkaç kez etkilendim. Bu çok eski bir teknik ama nedense beni hala etkiliyor - böyle bir ışık gördüğümde kesinlikle gözlerimi ondan ayırmayacağım.

Bu numaranın sayfanızda da işe yarayacağını söylemiyorum. Belirtmek istediğim nokta, öne çıkmanın pek çok yolu var, sadece kendinize soruyu sormanız ve biraz yaratıcı olmanız gerekiyor. İşte, örneğin, kendim hakkında pek düşünmediğim bir başka ilginç fikir:

Avatar siyah bir dairedir: büyük ve küçük. Görünüşe göre, neden bunu yapıyorsun? Ancak topluluklar listesinde gezindiğinizde bu tür avatarlar dikkat çekiyor çünkü herkesten çok farklılar.

Avatar küçük resmine hangi bilgiler yerleştirilebilir?

Avatar küçük resmi çok küçük olmasına rağmen, takipçilerinizi topluluğunuza çekmek için kullanılabilir (ve kullanılmalıdır). Nasıl yapılır? Birkaç seçeneğe bakalım:

Yeni bir ürün/hizmet/etkinlik duyurusu

Şirketin/hizmetin/sayfanın faydaları

Şirket telefon numarası

uygun fiyatlar

Ücretsiz kargo

Bu arada, çoğu zaman şirketin ücretsiz gönderim sağladığı bilgileri grubun adına eklenir, böylece kullanıcılar kesinlikle buna dikkat eder.

Stoklamak

yarışmalar

Meslekler

Avatarın kendisi ne olmalı?

Avatarın küçük resminin ne olması gerektiğini ve üzerine hangi metnin yerleştirilebileceğini düşündüm. Şimdi avatarın kendisine geçelim. Avatarın tam sürümü yalnızca kapak seti olmayan toplulukta gösterilecektir. Bu bölümü bu tür durumlar için yazdım. Peki, kullanıcıların şirketinizin sayfanın oluşturulmasına sorumlu ve profesyonel bir şekilde yaklaştığını hemen anlaması için topluluk avatarınız nasıl görünmelidir.

1. Avatar yüksek kalitede olmalıdır. Bunun nasıl başarılacağı hakkında biraz daha yüksek yazdım. Bu kısmı kaçıranlar için kısacası - avatarın boyutu planladığınızdan 2-3 kat daha büyük olmalıdır.
2. Avatarın menü ile birleştirilmesi arzu edilir: aynı renk şemasına sahip olun, aynı yazı tiplerine, öğelere vb. sahip olun. Bu sayede sayfa başlığınız daha düzenli ve profesyonel görünecektir. Örnek:
3. Avatarın kendisi ve avatar küçük resmi farklı olabilir. Örneğin, avatarın üzerine bir daire çizebilir, onu istediğiniz gibi şekillendirebilir, o alanı küçük resim olarak seçebilir ve avatarın geri kalanını farklı bir tarzda şekillendirebilirsiniz.




Başka bir seçenek de avatarı iki parçaya bölmektir. Biri küçük resim için, diğeri avatarın geri kalanı için.




4. Kullanıcıları sayfanıza abone olmaya veya bir şirket temsilcisine mesaj yazmaya teşvik etmek için profil resminin en altına uygun bir harekete geçirici mesaj yerleştirebilir ve düğmeyi gösteren bir okla ona eşlik edebilirsiniz.




5. Avatar üzerine çok fazla bilgi koymamaya çalışın, aksi takdirde aşırı yüklü ve düzensiz görünecektir. Sadece en önemli noktaları ekleyin ve aralarında “hava” olduğundan emin olun.

Avatar üzerine hangi bilgiler yerleştirilebilir?

Aslında, avatarın üzerine her şey yerleştirilebilir. Minyatürden farklı olarak, gerçekten dolaşmak için bir yer var. En önemlisi, kötüye kullanmayın :)

site etki alanı

Telefon / adres / çalışma saatleri

Yarışmalar/promosyonlar

En Çok Satın Alınan Ürünler/Haberler

teslimat hakkında bilgi

Mobil Uygulama Reklamcılığı

Firmanın/sayfanın/ürün vb. başlıca avantajları.

Menzil yenileme/yeni kreasyonlar vb.

Topluluğunuzun resmi olduğu bilgisi

Yaklaşan etkinlikler hakkında bilgi

Diğer sosyal ağlardaki hesapların adresleri

Genişletilmiş sayfa açıklaması

Övünüyor

Genel olarak, avatara kesinlikle herhangi bir bilgi yerleştirilebilir. Sadece birkaç fikir ekledim, böylece başkalarının ne yaptığını görebilir ve örneklerinden ilham alabilirsiniz. Ana önerileri aklınızda bulundurun: avatar yüksek kalitede olmalı, yazı tipi büyük olmalı ve öğeler arasında daha fazla "hava" olmalıdır.

Birleştirilmiş bir avatar ve menü nasıl oluşturulur

Birleştirilmiş bir avatar ve menü yapmak için Adobe Photoshop veya eşdeğerine ihtiyacınız olacak. Örnek olarak Photoshop kullanarak tüm süreci açıklayacağım. O zaman hadi gidelim.

1. Bu yazı için özel olarak hazırladığım Photoshop şablonunu indirin. Normal boyut (menü 510 piksel genişliğinde, avatar 200) veya yakınlaştırılmış (menü 1020 piksel genişliğinde, avatar 400).
2. Temel almak istediğiniz görüntüyü açın.
3. Kopyalayın, şablona yapıştırın ve kesilmesini istediğiniz şekilde konumlandırın.

1. Efektler, metinler, grafikler ve daha fazlasını ekleyin.

1. Resmin bir kısmının kaybolmasını istemiyorsanız (50 piksel olan bu boşlukta), aşağıdaki gif'te gösterildiği gibi sağa hareket ettirin:

1. "Yerleştirme" aracını seçin ve "Kılavuzlar boyunca parçalar" düğmesini tıklayın.

1. Gereksiz parçaları silin (sağ tıklayın - "Parçayı sil") ve mevcut olanları düzenleyin (sağ tıklayın - boş bir yere tıklayın - istediğiniz alanı alın ve istediğiniz boyuta uzatın).

1. "Dosya" bölümüne gidin ve "Web için Kaydet" komutunu seçin.

1. Resimleri kaydettiğiniz yere gidin (masaüstü veya belirli bir dizin) ve orada "Görüntüler" adlı bir klasör bulun. Burası resimlerinizin olacağı yer. Şimdi sadece onları sayfada doldurmak için kalır.

not Avatarın yüksekliği sizin takdirinize göre değiştirilebilir. Maksimum boyutu - 500 pikseli aldım, ancak bu değeri daha az alabilirsiniz. Örneğin, "Wiki işaretlemesi" sayfasında olduğu gibi:

Widget'lar nasıl kullanılır?

Widget'lar ayrıca VK topluluğunun tasarımının bir parçasıdır. Bunların yardımıyla kullanıcı şunları yapabilir: sipariş verebilir, bülteninize abone olabilir, bir yarışmaya katılabilir, yorumları okuyabilir ve bırakabilir, topluluk araması açabilir, hediye alabilir, indirim kuponu vb.

VKontakte sayfasında widget'ların nasıl göründüğüne dair bazı örnekler:

Resimler nasıl gönderilir?

Bir web tasarımcısıysanız veya sanatsal bir zevke ve güzellik anlayışına sahipseniz, görselleriniz için kurumsal bir kimlik bulmanız zor olmayacaktır. Ancak bana öyle geliyor ki, bu yazıda bu tür insanlardan bir azınlık olacak (bu arada ben de onlardan biri değilim). Bu nedenle, başarılı şirket örneklerinden yola çıkarak bunun nasıl yapıldığına daha yakından bakalım.

Bu arada, hemen hemen tüm tanınmış VKontakte şirketlerinin resimlerini markalaştırdığını, yani küçük bir logo, sayfa adresi veya filigran eklediklerini lütfen unutmayın. Bu, marka bilinirliğini artırır ve resimlerinizin kopyalanmasını önler. Buna değer mi, herkes kendisi için karar verir. Tavsiye etmek istediğim tek şey, bunu yapmaya karar verirseniz, logonuzun çok parlak olmamasına ve çok fazla yer kaplamamasına dikkat edin, aksi takdirde tüm vurgu ona gidecek ve görüntü olacaktır. temyizini kaybeder.

İyi görüntüleri nereden alabilirim?

Blogumuzda bu konuyla ilgili iyi bir makalemiz var - "". Hepsi ücretsizdir, ancak bazıları kayıt gerektirir. Kendinize uygun bir şey bulamazsanız, anahtar kelime + duvar kağıdı (veya İngilizce ise duvar kağıdı) ile arama yapmayı deneyin. Tipik olarak, böyle bir istek, yüksek kaliteli görüntüler üretir. Ancak burada dikkatli olmanız ve lisans türünü kontrol etmeniz gerekiyor, aksi takdirde ciddi bir işiniz varsa başınız belaya girebilir.

Peki Photoshop'ta nasıl çalışılacağını bilmeyenler ne olacak?

Photoshop'ta (veya başka herhangi bir grafik düzenleyicide) hiç çalışmadıysanız ve henüz ustalaşmak için zaman ayırmaya hazır değilseniz, çeşitli sosyal ağlar için zaten hazır görüntü şablonlarına sahip hizmetleri kullanabilirsiniz:

1. Fotor.com

Bundan sonra, ekranın sol tarafında bizi ilgilendiren şablonu seçin. Lütfen yalnızca elmas simgesi olmayan şablonların ücretsiz olarak sağlandığını unutmayın.

Şablona yerleştirin, farenin sol tuşuyla seçin, Katman komutunu (sandviç simgesi) seçin ve En alta taşı'ya tıklayın. Böylece resmimiz arka planda kalacak ve tüm yazılar bunun üzerine bindirilecek.

Bundan sonra metni, yazı tipini, yazı tipi boyutunu, yazının konumunu vb. Değiştiriyoruz.

Ardından disket şeklindeki simgeye tıklayın, adı, görüntü biçimini, kaliteyi seçin ve indirmek için oturum aç düğmesine tıklayın.

2.Canva.com

Resminizi güzelce düzenlemenize yardımcı olacak başka bir hizmet. Bir öncekiyle aynı prensipte çalışır. Hizmete kayıt oluyoruz (Google+ hesabınızı veya e-postanızı kullanabilirsiniz).

Faaliyet alanınızı seçin. Arkadaşlarınızı davet etmenizin istendiği adımı atlıyoruz. Dikdörtgen bir fotoğrafa ihtiyacımız varsa bir Facebook gönderisini veya kare bir fotoğrafa ihtiyacımız varsa bir Instagram gönderisini seçtiğimiz ana menüye gidiyoruz.

Bir şablon seçin (şablon "ÜCRETSİZ" olarak işaretlenmişse ücretsizdir), metni değiştirin.

Gerekirse resminizi yükleyin, boyutunu ayarlayın, yazının metnini, yazı tipini ve konumunu değiştirin. Bundan sonra, "İndir" düğmesine tıklayın, görüntü biçimini seçin ve bilgisayarınıza veya başka bir cihaza kaydedin.

Editörde makaleler nasıl biçimlendirilir

Son zamanlardan beri, VKontakte makaleleri özel bir editörde dizebiliyor. Bir makale oluşturmak için "T" harfine tıklamanız gerekir:

wiki işaretlemesi nasıl kullanılır

İşte geldik en ilginç ve aynı zamanda en zor kısma. Belki okuyucular arasında wiki işaretlemesinin ne olduğunu bilmeyenler vardır ve genel olarak bu terimi ilk defa duyarlar. Bu nedenle özellikle sizin için "İletişim" in kendisinin verdiği bir tanım vereceğim.

Wiki işaretlemesi, web sitelerindeki (genellikle wiki projeleri olarak sınıflandırılan) metni biçimlendirmek için kullanılan ve HTML dilinin özelliklerine erişmeyi kolaylaştıran bir işaretleme dilidir. Sitemizde wiki sayfaları, normal gönderilere ve metin navigasyonuna iyi bir alternatiftir. Farklı metin formatlarıyla (kalın, altı çizili, başlıklar vb.) büyük bir makale oluşturmanız veya buna grafik eklemeniz veya topluluğunuz için renkli bir gezinme menüsü oluşturmanız gerekiyorsa, bir wiki vazgeçilmezdir.

Tıpkı Wordpress'in (veya diğer herhangi bir CMS'nin) makaleler oluşturduğunuz bir HTML düzenleyicisi olduğu gibi, Contact'ın da wiki sayfaları oluşturmak ve düzenlemek için kendi düzenleyicisi vardır. Şuna benziyor:

Bu düzenleyici ile gezinme menülerinin yanı sıra resim, video ve ses kayıtları içeren makaleler oluşturulur. Biraz daha aşağıda, bu düzenleyicide nasıl çalışılacağını ayrıntılı olarak analiz edeceğim, ancak önce sizden iki bağlantıyı kendiniz için işaretlemenizi istiyorum. Wiki işaretlemesini öğrenmede size çok yardımcı olacaklar.

Vkontakte sosyal ağını aktif olarak kullanan herkesin güzel tasarlanmış gruplar ve halklarla tanıştığını düşünüyorum. Çoğu, menüye ek olarak, sosyal ağın hemen içinde küçük bir site oluşturan çok sayıda stilize iç içe sayfalara, dizinlere vb. sahiptir.

İşte herkesin neden bahsettiğimi anlaması için birkaç örnek.

Bu tür gruplar, rakiplerinizden öne çıkmanıza ve daha fazla kullanıcı çekmenize olanak tanır. Özellikle içerik de ilginçse :)
Bu yazıda, tüm bunların nasıl yapıldığından bahsedeceğiz. Her şeyi daha ayrıntılı analiz etmek ve tüm incelikleri araştırmak için belirli bir örnek alalım. Grupların tasarımı konusunda küçük bir ustalık sınıfı olacak.

Çalışmamızın ilk aşaması bir fikirdir. Neyi ve kime anlatmak istediğimizi anlamamız gerekiyor. Temas halinde, çeşitli topluluk biçimleri vardır ve belirlenen görevleri dikkate alarak seçmeye değer. Her ne kadar gelecekte grup genel formata aktarılabilse de, bunun tersi de mümkündür.

parmaklarımla açıklıyorum. Halk Blog gibi bir şey. Zaman çizelgesi. Yani abonelerimize bazı şeyleri anlatıyoruz ve onlar topluluğumuzun duvarına yazamayacaklar. Maksimum yorum.

Grup insanların kendi adlarına yayında gönderiler yapabilecekleri, konuşmaya ve tartışmaya daha açık bir topluluk oluşturmanıza olanak tanır. Ayrıca listenizden arkadaşlarınızı da buna ekleyebilirsiniz. Kamuda böyle bir seçenek yok. Ek olarak, grubun wiki işaretlemesini entegre etmek için biraz daha seçeneği vardır (menüyü entegre edebileceğiniz bir "Haberler" bölümü vardır).

Küresel olarak, şöyle tartışabilirsiniz: Mağaza için bir topluluk oluşturmamız gerekirse, o zaman “genel” formatı alırdım. Eğer Konuşuyoruz, örneğin, balık tutkunları hakkında bir "grup" almak daha iyidir. Yine de herkes uygun gördüğü gibi yapmakta özgürdür. Sonuçta, herhangi bir zamanda format değiştirilebilir. Ancak, Vkontakte'nin topluluk biçimini tekrar değiştirme konusunda bir kısıtlama getirdiğini ve ilk seferden sonra gerekirse her şeyi geri verene kadar birkaç gün beklemeniz gerekeceğini unutmayın. Bu nedenle, grup içerikle dolmaya başlamadan önce işlevselliği test etmek daha iyidir.

Bu ustalık sınıfının bir parçası olarak, sadece birkaç hafta önce vizyona giren aynı adlı filmden uyarlanan Mad Max oyununu başlangıç ​​noktası olarak alıp, bu oyunda çeşitli materyallere sahip oyuncular için bir topluluk oluşturacağım. Ana amaç, oyun sitenize trafik çekmektir.

Doğal bir izleyici akışı yaratmak ve topluluk içindeki iletişimi en üst düzeye çıkarmak gerektiğinden, format “Grup” olacaktır. Hem grup formatında hem de halka açık olarak kullanılabilecek evrensel bir teknik kullanacağımı hemen açıklayacağım. Her yerde çalışır.

İçerik denizi, fikri hayata geçirmeye başlıyoruz!

Grup oluştur

Bir grup oluşturmak için Vkontakte hesabınızın sağ menüsündeki "Gruplarım" a gidin ve "Topluluk oluştur" un üstündeki mavi düğmeyi tıklayın.

Grubumuz için bir isim girdiğimiz ve bir format seçtiğimiz böyle bir pencere görünmelidir.

Gerekli bilgileri girdikten sonra önümüze topluluğumuza ait kontrol paneli açılıyor. Benim durumumda, bu gibi görünüyor.

Gördüğünüz gibi, birkaç seçenek ekledim: İçerik toplarken gelecekteki çalışmalarımda bana faydalı olacak video, ses kayıtları, tartışmalar ve diğer bir dizi özelliği ekledim. Bütün bunlar gelecekte herhangi bir kısıtlama olmaksızın değiştirilebilir. Web sitemin adresini de yazdım. Bir web siteniz yoksa veya konusu topluluk formatına uymuyorsa (bunlar farklı şeyler hakkındadır ve birbirleriyle hiçbir şekilde ilişkili değilse), bu satır boş bırakılabilir.

Bu durumda, geliştiricilerin oyun için belirledikleri yaş sınırlarını 18'den itibaren belirledim. Gerçi çocukların da oynadığından pek şüphem yok.

Her şey. Grup oluşturuldu!

Şimdi şekillendirmeye başlayabilirsiniz.

Vkontakte grubu yapmak

Bu aşama 2 bileşene ayrılabilir: grafik ve teknik. Çalışmak için, bir grup avatarı ve menüsü oluşturmak için bir şablona, ​​ayrıca biraz hayal gücüne ve Photoshop (aka Adobe Photoshop) hakkında temel bilgilere ihtiyacımız var.

İşaretleme Şablonu

Şablon nedir ve ne hakkındadır? Bir şablon bir tür boşluktur. Bu durumda, *.psd formatında, menü altındaki resim ve grubun avatarları için alanları işaretledik.

Bu yazının başındaki ikinci örnekte de göreceğiniz gibi avatar ve menü resmi için tasarımı aynı tarzda yapabiliriz. Aynı zamanda görsel olarak 2 parçaya bölünmüştür. Böylece şablon, grafik kaymasını ortadan kaldıracak ve resimleri mümkün olduğunca tek bir düzeye sığdıracak şekilde bir görüntü oluşturmanıza olanak tanır.

Daha açık hale getirmek için, işte bir örnek.

Resmin her iki tarafında da yerleşim alanına bakan bir şerit olduğunu görebiliyoruz. Bir şablon kullanmadan, ilk seferde tam olarak yapmak neredeyse imkansızdır. 1 piksele kadar olan tutarsızlıkları ölçerek resimleri ayarlamak gerekli olacaktır. Bir şablon kullanırken, işaretleme içinde ona grafikler ekleriz ve hemen istenen sonucu alırız.

Bu şablonun açıklama kısmında 1 satır için tasarlandığını belirtmek isterim. Örneğin ekran görüntüsünde telefonlar var. İkinci bir satır belirirse, farklı bir şablon kullanmanız veya tasarımı manuel olarak düzeltmeniz gerekir.

Bu arada direkt olarak yeni grubumuzun grafik tasarımına geçiyoruz. Burada en az dirençli yolu seçiyorum ve tasarımın bölümlerini bulmak için Google Görseller'e gidiyorum. Yandex'i de kullanabilirsiniz. Kim neyi sever.

Tasarım eğitimim yok, bu yüzden yazı tipi seçimi ve diğer önemsiz şeyler üzerinde durmayacağız. Photoshop'ta biraz ince ayar yaptıktan sonra bu sonucu aldım.

Sol parçaya ("Menü" yazısının bulunduğu) ayrıca birkaç tetikleyici ekleyebilirsiniz. Bu durumda, onlarsız yapmaya karar verdim. Her şey. Avatar tasarımı hazır. Photoshop'ta Shift + Ctrl + Alt + S kısayol tuşlarının kombinasyonuna basıyoruz ve parçalarımızı sabit sürücümüzdeki bir klasöre kaydediyoruz.

Grafiklerle çalışmanın ilk aşaması tamamlandı. Tekrar iletişime geçelim.

Grup için avatar ve menüyü ayarlama

Grubumuzun ava yerine iki türe tıklayıp resmimizi oraya yüklüyoruz. İşte bu adamlar, altlarında "Fotoğraf yükle" yazıyor.

Bir resim ekliyoruz. Alanları belirtin ve küçük resmi seçin. Burada her şey basit ve sorun olmamalı.

Gördüğümüz gibi, topluluk kimliğini bilmeniz gerekiyor. Onu tanımak çok kolaydır. Menüyü grubumuzda (hemen avatarın altında) buluyoruz ve "Topluluk İstatistikleri" ni açıyoruz. Bu durumda, tarayıcının adres çubuğunda benzer bir şey görünecektir (sayılar farklı olacaktır).

"?gid="'den sonraki bu sayılar istenen grup kimliğidir. Alınan değeri script formuna ekliyoruz ve oluşturmak istediğimiz sayfanın adını yazıyoruz. Bu durumda, "Menü" de sürüyorum.

Sayfanın ancak bir sonraki sekmede grubun bulunduğu pencerenin açık olması durumunda oluşturulacağına dikkat edilmelidir. Basitçe söylemek gerekirse, aynı tarayıcıda VK'ya giriş yapmış olmalısınız. Sonuçta, yalnızca grubun yöneticisi ve onlara atanan kişiler bu tür manipülasyonlara erişebilir. Rastgele yoldan geçen bir kişi, erişimi olmadığı bir grubun ayarlarını yönetici paneline kolayca alamaz ve değiştiremez.

Her şey doğru yapılırsa, aşağıdaki sayfa açılacaktır.

Bu, biraz sonra bir wiki işaretlemesi yapacağımız ve grubumuz için dahili bir menü oluşturacağımız penceredir. Şimdilik buraya bir şeyler yazmamız yeterli. Ardından mavi renkli "Sayfayı kaydet" düğmesini tıklayın ve en üstte Sayfaya dön bağlantısını tıklayın.

Kendime bir “Menü” yazdım ve kaydettikten sonra sayfam böyle görünmeye başladı.

Henüz bir tasarım yok, ancak şimdilik bu sayfaya bir bağlantıya ihtiyacımız var. Tarayıcının adres çubuğundan alıyoruz ve grubumuzun ana sayfasına dönüyoruz. Bantlamak için.

Burada aşağıdaki içeriğe sahip bir gönderi oluşturuyoruz: oraya bir resim ve grubun menü sayfasına bir bağlantı ekliyoruz.

Gönder'e basıyoruz. Ardından mesajın gönderildiği saate tıklıyoruz ve tüm seçenekler arasından “Pin” maddesini seçiyoruz. Sayfayı yenileriz (klavyedeki F5 tuşu) ve her şey doğru yapılırsa ilk sonucu alırız: grup bir avatar ve menü bölümüne gitmek için bir bağlantı buldu.

Vkontakte grup menüsü için Wiki işaretlemesi

Şimdi menünün tasarımıyla ilgilenelim. Yine Photoshop'a gidiyoruz ve menümüz için bir tasarım oluşturuyoruz. Arayüzü tasarlarken, cep telefonlarından uygulama üzerinden VK'ya girecek kişileri hatırlamanız gerekir. Başka bir deyişle, küçük unsurlara sahip olmamalıyız ve ayrıca her şeyi mümkün olduğunca netleştirmeye çalışmalıyız. Böylece burada her şeyin nasıl çalıştığını ve nereye tıklayabileceğimizi tahmin etmenize gerek kalmaz ... doğru öğeyi dürterek aradığınız bilgiyi inceleyin.

Şimdi menüyü tam olarak nasıl oluşturduğum üzerinde durmayacağım. Ben de öyle yaptım.

Minimum alanlar. Dikey düzen. Duyarlı bir menü için mükemmel format. Yani, cep telefonlarında hiçbir şey hiçbir yere gitmeyecek. Her şey tam olarak bilgisayar ve tablet ekranlarındaki gibi olacak. 500 piksel genişliğini alıyorum, böylece daha sonra hiçbir şey küçülmez ve görüntü kalitesini iki kez kaybetmez. Yükseklik önemli değil.

Görüntüyü parçalara ayırıp kaydediyoruz.

Her şey. Son akorun zamanı geldi - menüyü zaten grubun kendisinde topluyoruz.

Bunu yapmak için, grubun ana sayfasına (beslemenin olduğu ve menüye giden bağlantı resmimizin olduğu yere) dönüyoruz. Menü resmine tıklıyoruz ve menü için daha önce oluşturulmuş olan sayfaya gidiyoruz.

Bir yönetici veya bir grubun yaratıcısıysanız (bizim durumumuzda durum budur), sayfanın üst kısmında bir "Düzenle" bağlantısı olacaktır. Üzerine tıklıyoruz.

Ardından wiki işaretleme moduna geçiyoruz (sayfanın sağ üst köşesindeki kapat düğmesinin altında, böyle bir çerçeve ile çizilir)<>içeri). İstenilen mod etkinleştirildiğinde bu düğme gri daire içine alınır.

Ardından kamera ikonuna girip menümüzün tüm parçalarını tek seferde ekliyoruz. Wiki modunda, resimlerin kendisini görmeyeceğiz, sadece bu resimlerin boyutları ve parametreleri ile kodu.

Menüyü ortalamak ve parçalar arasında boşluk olmamasını istiyorum. Bu nedenle, öğelerin her biri bir etikete sarılır.

ve zaten iç içe geçmiş "noborder" parametresine "nopadding" ikinci parametresini ekliyorum. İlki, tablo hücreleri için parçaların ve kenarlıkların konturunu devre dışı bırakır. İkincisi, kenar boşluklarını kenardan kaldırır.

İlk ve son menü öğeleri düğmeler olmamalıdır - benim resmimde bu yalnızca dahili sayfaya bağlantısı olmayan bir grafik öğesidir, bu nedenle onlara “nolink” parametresini ekliyoruz. Bu, resmin bir parçasını ayrı bir pencerede açmak için bu öğeye tıklama olasılığını ortadan kaldıracaktır. Fareye tıklamak hiçbir şey yapmaz. Bu normal sayfa arka planıdır. Etkin değil.

Benim durumumda, menü kodu şöyle görünüyor.

Ayrı olarak, resimleri VK'ya aktardıktan sonra, yerleşik sistemin bazen görüntülerin boyutunu yanlış gösterdiğini belirtmek isterim. Bu nedenle, bunu dikkatlice izlemeli ve tasarım aşamasında planladıklarımızı tam olarak ortaya koymalıyız. Aksi takdirde, her şey alt üst olabilir ve bulmaca sonunda çalışmayacaktır.

Kodu yazıp tüm öğeleri hizaladığımızda, sayfayı kaydediyoruz ve Photoshop'ta olanın aynısını görüyoruz.

Son dokunuş kalır - menümüzün insanları göndereceği sayfaları oluşturmanız gerekir. Bunu yapmak için tekrar wiki sayfaları oluşturmak için komut dosyasına dönüyoruz ve bu sefer aynı anda üç sayfa sipariş ediyoruz. Aynı zamanda, her birinin üzerine bir şeyler yazmak ve adreslerini tarayıcının adres çubuğundan bir yere kaydetmeyi unutmayın.

Ardından, sayfa-102302049_51013384 biçimindeki menü wiki koduna yeni sayfalara bağlantılar ekliyoruz, burada ilk sayı grup kimliği ve ikincisi sayfa numarasıdır. Genel olarak, önemli olmasa da. Sonuçta, bu URL parçasını kopyalamamız ve işaretlemeye yapıştırmamız yeterli.

Sonuç olarak, menü kodu aşağıdaki formu alır.

Dıştan, hiçbir şey değişmedi. Ancak menü öğelerine tıkladığımızda artık çalıştığını görebiliriz!

İşaretlemenin kendisine ve kodun yazıldığı kurallara gelince, bu konuya özel olarak ayrılmış Vkontakte grubunu okumanızı tavsiye ederim. Adamlar tüm önemli noktaları açıkladılar ve gerekli öğeyi kataloglarında kolayca bulabilir ve onu wiki sayfanıza nasıl ekleyeceğinizi anlayabilirsiniz.