Bir WeChat Resmi Hesabı (ya da herhangi bir zengin metin yayını) yönetiyorsanız, yeniden kullanmayı dilediğiniz düzenler görmüşsünüzdür — başlıklı bir bölüm kartı, bir takip bloğu, stilli bir alıntı, bir ayraç. Bunları elle kopyalamak iç içe geçmiş HTML'i eşelemek demektir ve tek bir yanlış düzenleme tüm SVG'yi bozar. Bu araç sıkıcı kısmı sizin için yapar: bir makale yapıştırın, her stilli bloğu bağımsız, yeniden kullanılabilir bir modül olarak çıkarsın.
Oradan bir bloğun içindeki görselleri değiştirebilir (yeni bir tane yükleyin ya da URL yapıştırın), kullandığı herhangi bir renge tıklayarak renklendirebilir, bloğu WeChat editörüne, bir CMS'e ya da herhangi bir zengin metin kutusuna yapıştırmaya hazır satır içi HTML olarak kopyalayabilir — ve beğendiklerinizi bu tarayıcıda yaşayan yerel bir kütüphaneye kaydedebilirsiniz. Hiçbir şey yüklenmez; materyalleriniz sizindir.
Her şey Clipboard ve localStorage API'leriyle istemci tarafında çalıştığı için hesap, bulut ve arka uç yoktur — IMG.DIY'nin geri kalanının arkasındaki aynı yerel öncelikli fikir.
Nasıl kullanılır
- Bir makale yapıştırınBir WeChat makalesini (ya da herhangi bir zengin içeriği) kopyalayıp kutuya yapıştırın. Ham HTML kaynağı da yapıştırabilirsiniz.
- Modülleri çıkarınÇıkar'a tıklayın — her stilli blok, sayfa stillerinin karışamaması için yalıtılmış kendi önizleme kartı olarak görünür.
- Düzenleyin ve yeniden kullanınGörselleri değiştirin, renklendirin, ardından başka yere yapıştırmak için HTML'i Kopyala ya da sonrası için yerel kütüphanenize Kaydet.
Düzen modüllerini yeniden inşa etmek yerine neden çıkarmalı
WeChat makalelerindeki iyi görünen bloklar — başlıklı bölüm kartları, takip et istemleri, stilize alıntılar, SVG ayraçları — neredeyse her zaman elle birleştirilmiş satır içi HTML ve SVG'dir. Birini sıfırdan yeniden inşa etmek, dolguları, renkleri, gradyanları ve iç içe span'ları tam olarak eşlemek anlamına gelir ve tek bir yanlış düzenleme SVG'yi çökertir. Bunun yerine bitmiş bloğu çıkarmak her ayrıntıyı olduğu gibi korur ve onu saniyeler içinde yeniden kullanabileceğiniz bir şeye dönüştürür.
Bu araç, yapıştırdığınız makaleyi ayrıştırır ve her stilize bloğu bağımsız bir modül olarak çeker. Tüm bir sayfayı tek bir yığına kazımıyorsunuz; başka birinin gönderisinde hoş bir düzen gördüğünüzde istediğiniz tam şeyi — düzenli bir bağımsız, yeniden kullanılabilir parçalar listesini — elde ediyorsunuz.
Önce yerel, böylece varlıklar gerçekten sizin
Bulut düzenleyiciler kaydedilmiş bloklarınızı bir hesabın arkasında kendi sunucularında tutar. Burada kitaplık localStorage aracılığıyla kendi tarayıcınızda yaşar ve yedeklemek ya da makineler arasında taşımak için onu bir JSON dosyasına dışa aktarabilirsiniz. Hiçbir şey yüklenmez, kayıt yoktur ve ayrıştırma, görsel değiştirme ve yeniden renklendirme, tarayıcının kendi DOM ve Clipboard API'leriyle cihazınızda çalışır.
Pratik getiri, çalıştıkça büyüyen kişisel, taşınabilir bir modül kitaplığıdır: bir makaleyi yapıştırın, yeniden kullanmaya değer iki üç bloğu tutun ve bir dahaki sefere onları doğrudan satır içi HTML olarak geri sürükleyin.
İnsanlar bunu ne için kullanıyor
Beğendiğiniz bir düzeni yeniden kullanma — Başka bir makalede hoş bir başlıklı kart ya da ayraç görün — çıkarın, markanıza yeniden renklendirin ve kendi taslağınıza kopyalayın.
Bir stil kılavuzu kiti oluşturma — Her sayıda kullandığınız bölüm başlıklarını, alıntı stillerini ve takip et kartlarını tek bir yerel kitaplıkta toplayın.
Bir şablon bloğundaki görselleri değiştirme — Favori bir görsel-kart düzenini tutun ve her seferinde resmi kendi yüklemenizle değiştirin.
Markanıza yeniden renklendirme — Satır içi stiller arasında arayış yapmak yerine bir bloğun vurgu rengini bir kerede her yerde değiştirin.
Blokları düzenleyiciler arasında taşıma — WeChat düzenleyicisine, bir CMS'ye ya da herhangi bir zengin metin kutusuna stiliyle yapışan satır içi HTML kopyalayın.
Özel, taşınabilir bir arşiv tutma — Kitaplığınızı yedeklemek ya da başka bir tarayıcıya taşımak için JSON olarak dışa aktarın — hesap yok, bulut yok.
İyi düzen blokları başka insanların makalelerinin içinde tutsak
Bir WeChat Resmi Hesabı işleten herkes düzen bloklarını yavaş yoldan toplar. Güzel bir SVG başlık kartı, düzenli bir "bizi takip edin" paneli, yanında renkli bir sekmesi olan bir bölüm başlığı olan bir makale okursunuz ve düşünürsünüz: o yapıyı istiyorum. Böylece tüm makaleyi düzenleyicinize kopyalarsınız, sonra istediğiniz o tek blok dışında her şeyi silerek yirmi dakika harcarsınız, SVG'yi çökerten başıboş bir <span> kaçırmamak için dua edersiniz. WeChat'in SVG tipografisi kötü şöhretli biçimde kırılgandır — yanlış yerleştirilmiş bir öznitelik, yanlış yerde yeniden boyutlandırdığınız bir görsel ve kart, okurların yarısının telefonunda bozuk bir kutu olarak işlenir. İstediğiniz bloklar gerçektir, yeniden kullanılabilirdir ve tam orada, HTML'de durur, ama birini temizce çıkarıp saklamanın temiz bir yolu yoktur.
Acının diğer yarısı sahipliktir. Bariz yanıt 秀米 ya da 135编辑器 gibi bir şablon düzenleyicidir: devasa kütüphaneler, sürükle-bırak, gerçekten güçlü. Ama varlıklar onların bulutunda, bir hesabın ardında ve çoğu zaman bir üyelik katmanının ardında yaşar. Özenle bir araya getirdiğiniz stil kitiniz sahip olduğunuz bir klasör değildir — kiraladığınız bir giriştir. Bir bloğu bir ekip arkadaşına vermek, bir rengi tüm kartlarda aynı anda değiştirmek ya da sadece gerçekten yeniden kullandığınız beş başlığın kişisel bir kütüphanesini tutmak isterseniz, başkasının ürünü içinde, başkasının şartlarıyla çalışıyorsunuz.
Bu araç tam tersi yaklaşımı benimser. Bir makaleyi (ya da herhangi bir zengin içeriği ya da ham HTML'i) yapıştırırsınız ve o, işaretlemeyi doğrudan tarayıcınızda ayrıştırır, her yeniden kullanılabilir stilli bloğu — SVG tipografi kartları, başlıklı bölüm başlıkları, bizi-takip-edin kartları, stilli alıntılar, ayırıcılar — kendi bağımsız modülü olarak çıkarır. Oradan her birini doğrudan düzenlersiniz: bir kartın içindeki görseli değiştirin, yeniden renklendirin, WeChat düzenleyicisine ya da herhangi bir zengin metin kutusuna yapıştırmaya hazır temiz satır içi HTML olarak kopyalayın ve JSON olarak dışa aktarabileceğiniz yerel bir kütüphaneye kaydedin. Hiçbir şey yüklenmez, hesap yok ve sayfa bir kez yüklendikten sonra çevrimdışı çalışmaya devam eder. Başta dürüst bir sınır: bir makaleyi URL'siyle getiremez — tarayıcılar mp.weixin.qq.com'a siteler arası istekleri engeller, dolayısıyla giriş her zaman kopyala-yapıştırdır.
Onu farklı kılan ne
- Yerel öncelikli, hiçbir şey yüklenmez. Ayrıştırma tarayıcıda
DOMParserile gerçekleşir. Yapıştırdığınız makale makinenizden asla ayrılmaz — sunucu yok, hesap yok, arka uç yok. - Modül başına çıkarma. Her stilli blok, elle budamanız gereken karışık bir işaretleme duvarı yerine ayrı, kendi kendine yeten bir modül olarak çıkar.
- Yerinde görsel değiştirme. Bir kartın içindeki resmi, çevresindeki onu kırılgan yapan SVG yapısına dokunmadan yeni birini yükleyerek ya da bir görsel URL'si yapıştırarak değiştirin.
- Her yeri aynı anda yeniden renklendir. Bir modülün kullandığı herhangi bir renge tıklayın ve onu tek hamlede tüm blokta değiştirin; böylece bir kart, hex kodları arasında bir av olmadan markanıza uyar.
- Temiz satır içi HTML kopyası. Tek tık, modülü panonuza satır içi HTML olarak (Clipboard API aracılığıyla) koyar, doğrudan WeChat düzenleyicisine, bir CMS'e ya da herhangi bir zengin metin alanına yapıştırmaya hazır.
- Sahip olduğunuz bir kütüphane. Modülleri yerel depolamaya kaydedin ve tüm koleksiyonu JSON olarak dışa ya da içe aktarın — kiraladığınız bir giriş değil, gerçek, taşınabilir bir varlık kiti.
- İzole önizlemeler. Her modül Shadow DOM içinde işlenir; böylece bir bloğun stilleri diğerine sızamaz ve önizleme size tam olarak neyi yapıştıracağınızı gösterir.
- Yüklendikten sonra çevrimdışı çalışır. Sayfa yüklendikten sonra çıkarmak, düzenlemek ya da kopyalamak için bağlantı gerekmez.
IMG.DIY ile diğer düzen araçlarının karşılaştırması
| IMG.DIY Modül Çıkarıcı | 秀米 (xiumi.us) | 135编辑器 | i排版 | HTML'i elle kopyala | |
|---|---|---|---|---|---|
| Temel amaç | Yeniden kullanılabilir bloklar çıkar ve sahip ol | Tam şablon düzenleyici | Tam şablon düzenleyici | Tam şablon düzenleyici | — |
| Şablon kütüphanesi | Yok (yapıştırdığınızdan oluşturursunuz) | Devasa | Devasa | Büyük | Yok |
| Hesap gerekir | Hayır | Evet | Evet | Evet | Hayır |
| Bir şey yüklenir | Hayır | Evet (bulut) | Evet (bulut) | Evet (bulut) | Hayır |
| Varlıklara sahip olma | Evet (yerel JSON) | Kiralık / bulut | Kiralık / bulut | Kiralık / bulut | Evet, ama manuel |
| Blok başına görsel değiştirme | Evet | Evet (düzenleyicide) | Evet (düzenleyicide) | Evet (düzenleyicide) | Manuel |
| Tüm bloğu yeniden renklendir | Evet, tek tık | Evet (düzenleyicide) | Evet (düzenleyicide) | Evet (düzenleyicide) | Manuel |
| Çevrimdışı çalışır | Evet, yüklendikten sonra | Hayır | Hayır | Hayır | Evet |
| Fiyat | Ücretsiz | Ücretsiz katman + ücretli | Ücretsiz katman + ücretli | Ücretsiz katman + ücretli | Ücretsiz |
Adil olmak gerekirse, bu bir şablon düzenleyicinin yerine geçmez ve öyleymiş gibi de yapmaz. 秀米, 135编辑器 ve i排版, devasa şablon kütüphaneleri, canlı sürükle-bırak düzen ve yılların cilasıyla olgun ürünlerdir — sıfırdan zengin bir makale oluşturuyorsanız oraya gidersiniz ve ününü hak ederler. Size vermedikleri şey, yeniden kullandığınız belirli blokların, bir giriş olmadan düzenlenebilir ve makinenizden ayrılan hiçbir şey olmadan gizli, taşınabilir bir klasörüdür. Bu araç bir çıkarıcı ve düzenleyicidir, bir editör değil: doğada hayran olduğunuz blokları, sahip olduğunuz, yeniden renklendirdiğiniz, yeniden görsellediğiniz ve her yere yapıştırdığınız modüllere dönüştürür. Büyük editörleri oluşturmak için kullanın; parçaları saklamak için bunu kullanın.
Neden IMG.DIY
Blok çıkarma
SVG kartları, başlıkları, alıntıları ve ayraçları bağımsız modüller olarak çeker.
Görselleri yerinde değiştir
Bir bloktaki herhangi bir görseli kendinizinkiyle değiştirin — yükleme ya da URL.
Tek tıkla renklendir
Bir bloğun kullandığı herhangi bir renge tıklayın ve her yerde tek seferde değiştirin.
Satır içi HTML kopyala
Doğrudan WeChat editörüne, bir CMS'e ya da herhangi bir zengin metin kutusuna yapıştırın.
Yerel kütüphane
Modülleri bu tarayıcıya kaydedin ve JSON olarak dışa/içe aktarın.
Yükleme yok
Tamamen tarayıcınızda çalışır — materyalleriniz cihazınızdan asla çıkmaz.