Kamis, 09 Januari 2014

Bagaimana mengembangkan kebiasaan Tumblr theme

Sebagai seorang desainer web freelance dan pengembang Saya sudah terbiasa bekerja dalam urutan tertentu dari awal sampai akhir pada website klien khas. Alur kerja khas saya dimulai dengan pemrograman / sketsa yang kemudian mengarah ke pengembangan dan revisi semua dengan kontak konstan dengan klien sepanjang jalan.
Ketika saya ditanya tentang pengembangan untuk Tumblr pikiran saya awalnya kosong. Tumblr pada saat itu adalah sesuatu yang saya tidak pernah tahu atau mengerti mengapa seseorang ingin menggunakannya. Aku tidak tahu bagaimana disesuaikan itu benar-benar sampai aku menggali lebih dalam.
Tujuan dari posting ini adalah untuk berbagi beberapa wawasan tentang Tumblr dan bagaimana Anda dapat menggunakannya secara efektif untuk proyek-proyek yang akan datang Anda sendiri.

Manfaat utama

Manfaat sebenarnya dari Tumblr berada dalam bagian blogging dari setiap situs. Satu konsep yang menonjol bagi saya adalah hosting GRATIS untuk tema Anda. Ada langkah-langkah untuk membuat pekerjaan ini tetapi sekali Anda membawa mereka keluar semua yang Anda butuhkan adalah nama domain dan Anda emas.
Aturan yang sama berlaku ketika datang untuk mengembangkan sebuah situs web tradisional dengan tumblr tetapi setiap mencakup seperti CSS atau file JavaScript harus memiliki URL absolut (lebih lanjut tentang ini dalam sedikit).

Memulai

Untuk memulai Anda harus terlebih dahulu membuat account Tumblr. Menetapkan satu dan kemudian arahkan ke area pengaturan setelah log in Untuk setiap klien saya biasanya akan menyiapkan dua blog Tumblr atau menggunakan pengujian saya sendiri Tumblr dan membuat blog yang dilindungi password untuk pengembangan dan melihat sebelum situs ditayangkan. Untuk tujuan demo ini saya telah menyertakan desain blog terbaru Band saya (musik segera hadir :)). Di dalam sidebar Anda melihat pengujian saya blog dan kemudian blog utama menampilkan Tumblr band.
1_login
Anda mungkin bertanya-tanya mengapa saya membuat dua blog? Nah untuk melindungi sandi blog atau membuat pribadi Anda harus memiliki sebuah blog dasar di tempat pada Tumblr, yang saya lakukan di sini untuk melakukannya. Kemudian Anda dapat beralih fitur ini dan juga menjaga ekstensi sitename.tumblr.com atau beralih ke URL langsung seperti yang saya miliki. Anda juga dapat hanya melewatkan langkah ini jika Anda tidak khawatir tentang hanya merilis situs setelah itu sepenuhnya dikembangkan.
Untuk membuat klik blog pribadi di Buat blog link baru dalam side bar dan Anda akan dibawa ke halaman di bawah ini. Pastikan centang Privacy dipilih dan Anda baik untuk pergi.
2_passwordprotected

Ke depan

Sekarang kita pindah ke daging Tumblr: setelah Anda memiliki situs Anda dirancang dan diselesaikan itu kemudian waktu untuk pindah ke mengiris dan dicing itu untuk mengoptimalkan untuk Tumblr. Ada dua jenis operator untuk membuat konten dalam HTML yang ada. Anda akan perlu memiliki shell HTML dasar dibangun ketika memulai tema kustom.
Beberapa istilah kunci dan lins berguna:
  • Variabel: digunakan untuk memasukkan data dinamis seperti judul blog Anda atau keterangan.
  • Blok: digunakan untuk membuat HTML atau menyetel data seperti link sebelumnya atau posting blog.
Ada daftar lengkap dari berbagai jenis Variabel dan Blok Anda dapat menetapkan ke HTML Anda di sini. Daripada menyalin situs yang saya sangat menyarankan Anda mengunjungi halaman ini dan mendapatkan akrab dengan itu. Akan lebih baik bahkan melakukan hal ini sebelum Anda mulai desain Anda. Ada banyak fitur yang tersedia untuk tema Tumblr apapun yang dapat digunakan atau tidak digunakan dalam desain Anda sendiri. Situs saya band adalah situs tulang telanjang. Aku butuh tempat untuk orang-orang untuk pergi untuk mengetahui lebih lanjut dan melihat apa yang kita selalu up to dan itu tentang hal itu.

Anda akan ingin memiliki rencana untuk semua jenis tulisan yang tersedia dalam Tumblr. Kode ini dan gaya mereka benar untuk setiap blog yang Anda buat dan tentu saja melihat dokumentasi untuk memasukkan unsur-unsur lain yang penting seperti navigasi, pagination, meta data, reposts, komentar (catatan) dll:
  • {Block: Posts} Ini adalah pembungkus atau macam ke posting setiap {/ block: Posts}
  • {Block: Teks} Untuk posting berbasis teks {/ block: Text}
  • {Block: Photo} Untuk posting foto {/ block: Photo}
  • {Block: Photoset} Untuk posting foto dalam bentuk galeri {/ block: Photoset}
  • {Block: Quote} Untuk kutipan {/ block: Quote}
  • {Blok Link} Untuk Link {/ block Link}
  • {Block: Audio} Untuk posting audio yang {/ block: Audio}
  • {Block: Video} Untuk posting video yang {/ block: Video}

Jadi di mana saya menempatkan kode saya?

Untuk mengimpor HTML Anda baru dipoles dalam tema kustom Anda, Anda akan perlu untuk login dan pilih blog yang sesuai pada sidebar kiri di dalam bagian Settings dashboard. Carilah Pos berjudul Tema dan klik tombol Customize.
Setelah Anda mengklik tombol Anda akan disambut dengan sebuah halaman baru dengan beberapa pilihan editing kustom untuk situs Anda. Di bawah ini Anda melihat bagaimana situs jadi saya saat ini terlihat dengan konten dummy Tumblr. Daerah ini sangat bagus untuk melihat perubahan kepada setiap perubahan yang Anda buat dalam code editor Tumblr tapi aku benar-benar merekomendasikan mengembangkan situs menggunakan editor kode dasar dan browser dari awal. Setelah kode di tempat Anda dapat memasukkan variabel berdasarkan adat Tumblr dan blok elemen dalam HTML. Maka cukup copy dan paste perubahan Anda ke setiap halaman Tumblr kustom.
4_customize_landing
Untuk mengedit HTML klik tombol Edit HTML (ya itu mudah) dan jendela samping baru muncul. Anda akan melihat beberapa HTML dengan tema dasar apa pun yang Anda menyesuaikan. Hapus atau mengubah kode untuk mencocokkan gaya Anda sendiri dan desain dan kemudian klik Update Preview untuk melihat update halaman ke kanan. Satu hal yang saya tidak bisa cukup menekankan adalah dengan menggunakan URL absolut untuk host gambar Anda, CSS, JavaScript, dan apa pun termasuk yang mungkin Anda miliki karena mereka tidak akan menghubungkan dengan benar dalam Tumblr jika Anda tidak. Saya kebetulan telah hosting untuk website saya sendiri jadi aku hanya membuat sebuah direktori untuk menghubungkan gambar dan termasuk. Anda bisa dengan mudah menggunakan gambar atau file layanan hosting gratis. Saya hanya akan melakukannya jika Anda benar-benar yakin link tidak akan turun dan meninggalkan situs web Anda tanpa gaya atau gambar, dll ...
5_edit_html

Bagaimana jika saya ingin lebih banyak halaman?

Mudah. Setelah Anda mengklik tombol Edit HTML seperti saya sebutkan di atas, gulir ke bawah ke halaman bagian sidebar di sebelah kiri yang muncul. Di sini Anda akan melihat contoh yang saya berikan dengan halaman tambahan dari situs Band saya. Anda dapat menarik urutan mereka dan mengedit masing-masing individu.
Cukup klik + Tambah tautan halaman untuk membuat yang lain. Dengan setiap halaman baru Anda akan perlu untuk memperbarui konten serta navigasi jika, misalnya, Anda memiliki negara aktif yang berubah melalui CSS. Ini harus tidak brainer jika Anda telah bekerja dengan HTML dan CSS sebelumnya. Jika tidak, Anda harus memeriksa berbagai tutorial dan posting tentang hal ini di situs ini.
6_pages
Satu hal yang perlu diperhatikan adalah bahwa ketika Anda klik edit di samping halaman yang ada Anda akan melihat jendela browser baru muncul seperti di bawah ini. Pastikan untuk memiliki tata letak kustom aktif di drop down seperti yang Anda membuat tata letak kustom untuk setiap halaman. Pilihan yang ada untuk menggunakan tata letak standar dan memiliki link navigasi redirect ke yang lain.
7_edit_page

Fitur canggih

Di atas menciptakan gaya CSS dan dokumen HTML Anda sendiri, Anda memiliki kemampuan untuk menggunakan beberapa fitur canggih Tumblr, yang dibundel dengan masing-masing blog. Tepat di bawah bagian Pages Anda akan melihat bagian Advanced dengan beberapa pilihan yang tersedia.
8_advanced
Sebagian besar yang cukup jelas. Jika situs Anda tidak memiliki tata letak dioptimalkan mobile seperti saya tidak maka saya akan beralih pada penggunaan dioptimalkan opsi tata letak mobile. URL deskriptif membuat permalink untuk posting apapun jauh lebih diidentifikasi. Akhirnya, jika Anda dalam keadaan darurat, Anda bisa memasukkan beberapa CSS kustom di bawah itu, tapi itu hanya sebagai mudah untuk memasukkan CSS Anda sendiri melalui link absolut.

Saya tidak ingin ekstensi tumblr.

Orang-orang di Tumblr membuat ini mudah. Semua yang diperlukan adalah bahwa Anda memiliki nama domain Anda mencoba untuk mengarahkan blog Tumblr Anda.
9_custom_domain
Untuk menurunkan ekstensi Anda harus menavigasi ke pengaturan area dashboard Anda. Dari sana pilih Gunakan nama domain kustom dalam bagian URL. Masukkan domain yang tepat Anda telah terdaftar dan kemudian pastikan untuk menguji domain Anda dengan mengklik tombol biru menatap kembali pada Anda. Setelah Anda melakukan itu Anda harus memperbarui A-catatan pemasok domain Anda saat ini untuk menunjuk ke Tumblr, yang merupakan 66.6.44.4. Petunjuk lengkap tentang cara untuk melakukan hal ini adalah tersedia di sini.

Untuk meringkas

Menggunakan Tumblr adalah pilihan yang bagus untuk siapa saja yang tertarik dalam menjaga sebuah blog yang aktif atau bahkan mengembangkan sebuah situs web lengkap.
Saya membangun situs contoh Anda telah melihat seluruh tutorial ini dari bawah ke atas. Website pertama kali dirancang dalam photoshop. Setelah saya memutuskan pada gaya dan melihat saya mulai menerjemahkan desain statis menjadi pengalaman interaktif seperti situs serupa tapi kemudian menambahkan variabel dan blok yang diperlukan untuk Tumblr berfungsi sebagai tambahan, tetapi langkah mudah. Dari sana saya dioptimalkan agar sesuai pada perangkat mobile dan sisanya adalah sejarah.
Ada banyak lagi kustomisasi yang tersedia seperti menggabungkan Google analytics, pilihan yang dapat disesuaikan yang dapat diaktifkan dan dinonaktifkan dari panel pengaturan, koneksi ke aplikasi lain seperti Instagram, Facebook, dan banyak lagi, tetapi prosesnya secara keseluruhan adalah sangat mudah dan sangat dianjurkan untuk siapa pun tertarik dengan cara baru untuk menjadi tuan rumah sebuah situs blogging berbasis.

Tidak ada komentar:

Posting Komentar