the mvm.github.io
Initial Release of V2.0.0
Situs demo sekarang dicerminkan dalam IPFS!
Oleh Armando Maynez Berdasarkan v1.0 oleh Artem Sheludko.
Adam Blog 2.0 adalah tema Jekyll yang dibangun untuk 100% kompatibel dengan halaman GitHub. Jika Anda tidak terbiasa dengan halaman GitHub, Anda dapat memeriksa dokumentasi mereka untuk informasi lebih lanjut. Panduan Jonathan McGlone tentang membuat dan hosting situs pribadi di GitHub juga merupakan sumber yang bagus.
Jekyll adalah generator situs yang sederhana, sadar blog, statis untuk situs pribadi, proyek, atau organisasi. Pada dasarnya, Jekyll mengambil konten halaman Anda bersama dengan file template dan menghasilkan situs web yang lengkap. Untuk informasi lebih lanjut, kunjungi situs resmi Jekyll untuk dokumentasi mereka. Codecademy juga menawarkan kursus yang bagus tentang cara menggunakan situs Jekyll untuk pemula yang lengkap.
Keindahan hosting situs web Anda di GitHub adalah bahwa Anda tidak harus benar -benar menginstal Jekyll di komputer Anda. Semuanya dapat dilakukan melalui Editor Kode GitHub, dengan pengetahuan minimal tentang cara menggunakan Jekyll atau baris perintah. Yang harus Anda lakukan adalah menambahkan posting Anda ke direktori _posts dan mengedit file _config.yml untuk mengubah pengaturan situs. Dengan beberapa pengetahuan mendasar tentang HTML dan CSS, Anda bahkan dapat memodifikasi situs sesuai keinginan Anda. Ini semua dapat dilakukan melalui Editor Kode GitHub, yang bertindak seperti Sistem Manajemen Konten (CMS).
<tweet> </tweet> dalam penurunan harga Anda.Periksa tema yang sedang beraksi
Halaman utama terlihat seperti ini:
Pemilih Mode Gelap di Menu Utama:
Halaman posting terlihat seperti:
Responsif Kustom 404:
Mode gelap terlihat seperti ini:
Untuk instalasi lokal lengkap Adam Blog 2.0, unduh salinan Anda sendiri dari Adam Blog 2.0 dan unzip ke direktori sendiri. Dari sana, buka alat baris perintah favorit Anda, masukkan bundle install , lalu masukkan jekyll serve . Situs Anda harus berjalan dan berjalan secara lokal di http: // localhost: 4000.
Jika Anda benar -benar baru di Jekyll, saya sarankan memeriksa dokumentasi di https://jekyllrb.com/ atau ada tutorial oleh Smashing Magazine.
Jika Anda meng -hosting situs Anda di halaman GitHub, maka melakukan perubahan pada file _config.yml (atau file lainnya) akan memaksa pembangunan kembali situs Anda dengan Jekyll. Setiap perubahan yang dilakukan harus dapat dilihat segera setelah itu. Jika Anda meng -hosting situs Anda secara lokal, maka Anda harus menjalankan jekyll serve lagi agar perubahan terjadi.
Buka direktori _posts untuk melihat semua posting yang saat ini ada di situs web, dan untuk melihat contoh seperti apa file posting yang umumnya terlihat. Anda hanya dapat menduplikasi posting template dan mulai menambahkan konten Anda sendiri.
Parahkan repositori ini ke akun Anda sendiri.
Anda dapat meng -host situs Jekyll Anda secara gratis dengan halaman GitHub. Klik di sini untuk informasi lebih lanjut.
Saat bercabang, jika Anda menggunakan sebagai tujuan repositori bernama USERNAME.github.io maka url Anda akan https://USERNAME.github.io/ , selain itu https://USERNAME.github.io/REPONAME/ ) dan situs Anda akan diterbitkan ke cabang ghpages. Catatan: Jika Anda hosting beberapa situs di bawah nama pengguna GitHub yang sama, maka Anda harus menggunakan halaman proyek alih -alih halaman pengguna - cukup ubah nama repositori menjadi sesuatu selain 'http://username.github.io'.
Selain github-username.github.io repo Anda yang memetakan ke URL root, Anda dapat menyajikan situs dengan menggunakan cabang halaman GH untuk repo lain sehingga tersedia di github-username.github.io/repo-name.
Ini akan mengharuskan Anda untuk memodifikasi _config.yml seperti itu:
# Site settings
title : Repo Name
email : [email protected]
author : Your Name
description : " Repo description "
baseurl : " /repo-name "
url : " https://github-username.github.io "Ini akan memastikan bahwa jalur relatif yang benar dibangun untuk aset dan posting Anda.
Ubah file _config.yml , terletak di direktori root, dengan data Anda.
# Site settings
title : The Title for Your Website
description : ' A description of your blog '
permalink : ' :title:output_ext ' # how the permalinks will behave
baseurl : " / " # the subpath of your site, e.g. /blog
url : " " # the base hostname & protocol for your site, e.g. http://example.com
logo : " " # the logo for your site
logo-icon : " " # a smaller logo, typically squared
logo-icon-SEO : " " # must be a non SVG file, could be the same as the logo-icon
# Night/Dark mode default mode is "auto", "auto" is for auto nightshift (19:00 - 07:00), "manual" is for manual toggle, and "on/off" is for default on/off. Whatever the user's choice is, it will supersede the default setting of the site and be kept during the visit (session). Only the dark mode setting is "manual", it will be always kept on every visit (i.e. no matter the browser is closed or not)
night_mode : " auto "
logo-dark : " /assets/img/branding/MVM-logo-full-dark.svg " # if you want to display a different logo when in dark mode
highlight_theme : syntax-base16.monokai.dark # select a dark theme for the code highlighter if needed
# Author settings
author : Your Name # add your name
author-pic : ' ' # a picture of you
about-author : ' ' # a brief description of you
# Contact links
email : [email protected] # Add your Email address
phone : # Add your Phone number
website : # Add your website
linkedin : # Add your Linkedin handle
github : # Add your Github handle
twitter : # Add your Twitter handle
bandcamp : # Add your Bandcamp username
# Tracker
analytics : # Google Analytics tag ID
fbadmin : # Facebook ID admin
# Paginate
paginate : 6 # number of items to show in the main page
paginate_path : ' page:num '
words_per_minute : 200 # default words per minute to be considered when calculating the read time of the blog posts Untuk mengonfigurasi buletin, silakan buat akun di https://mailchimp.com, atur formulir pendaftaran web dan tempel tautan dari formulir pendaftaran embed di file config.yml :
# Newsletter
mailchimp : " https://github.us1.list-manage.com/subscribe/post?u=8ece198b3eb260e6838461a60&id=397d90b5f4 " Untuk mengonfigurasi Disqus, atur situs Disqus dengan nama yang sama dengan situs Anda. Kemudian, di _config.yml , edit nilai disqus_identifier untuk mengaktifkan.
# Disqus
discus_identifier : # Add your discus identifier
comments_curtain : yes # leave empty to show the disqus embed directlyInformasi lebih lanjut tentang cara mengatur disqus.
Kustomisasi warna situs. Odify /assets/css/main.css sebagai berikut:
html {
--shadow : rgba ( 32 , 30 , 30 , .3 );
--accent : # DB504A ; /* accent */
--accent-dark : # 4e3e51 ; /* accent 2 (dark) */
--main : # 326273 ; /* main color */
--main-dim : # 879dab ; /* dimmed version of main color */
--text : # 201E1E ;
--grey1 : # 5F5E58 ;
--grey2 : # 8D897C ;
--grey3 : # B4B3A7 ;
--grey4 : # DAD7D2 ;
--grey5 : # F0EFED ;
--background : # ffffff ;
}
html [ data-theme = "dark" ] {
--accent : # d14c47 ; /* accent */
--accent-dark : # CD8A7A ; /* accent 2 (dark) */
--main : # 4C6567 ; /* main color */
--main-dim : # 273335 ; /* dimmed version of main color */
--text : # B4B3A7 ;
--grey1 : # 8D897C ;
--grey2 : # 827F73 ;
--grey3 : # 76746A ;
--grey4 : # 66645D ;
--grey5 : # 4A4945 ;
--background : # 201E1E ;
--shadow : rgba ( 180 , 179 , 167 , .3 );
} Kustomisasi Font Situs. Odify /assets/css/main.css sebagai berikut:
...
--font1 : 'Lora' , charter , Georgia , Cambria , 'Times New Roman' , Times , serif ; /* body text */
- - font2 : 'Source Sans Pro' , 'Helvetica Neue' , Helvetica , Arial , sans-serif ; /* headers and titles */
- - font1 - light : 400;
- - font1 - regular : 400;
- - font1 - bold : 600;
- - font2 - light : 200;
- - font2 - regular : 400;
- - font2 - bold : 700;
... Jika Anda mengubah font, Anda juga harus memodifikasi /_includes/head.html sebagai berikut: uncomment dan ubah baris berikut dengan font baru dan bobot font Anda:
< link href =" https://fonts.googleapis.com/css?family=Lora:400,600|Source+Sans+Pro:200,400,700 " rel =" stylesheet " > Hapus semuanya di dalam <style></style> tepat sebelum garis di atas:
< style >
/* latin */
@font-face {
font-family: 'Lora';
...
</ style > Anda akan menemukan contoh posting di /_posts/ direktori Anda. Silakan edit dan edit setiap posting dan membangun kembali situs untuk melihat perubahan Anda, untuk halaman GitHub, ini terjadi secara otomatis dengan setiap komit. Anda dapat membangun kembali situs dengan berbagai cara, tetapi cara yang paling umum adalah menjalankan jekyll serve , yang meluncurkan server web dan mengatur secara otomatis situs Anda ketika file diperbarui.
Untuk menambahkan posting baru, cukup tambahkan file di direktori _posts yang mengikuti konvensi YYYY-MM-DD-name-of-post.md dan termasuk materi depan yang diperlukan. Lihatlah setiap posting sampel untuk mendapatkan ide tentang cara kerjanya. Jika Anda sudah memiliki situs web yang dibangun dengan Jekyll, cukup salin melalui posting Anda untuk bermigrasi ke Adam Blog 2.0.
Opsi materi depan untuk setiap posting adalah:
---
layout : post # ensure this one stays like this
read_time : true # calculate and show read time based on number of words
show_date : true # show the date of the post
title : Your Blog Post Title
date : XXXX-XX-XX XX:XX:XX XXXX
description : " The description of your blog post "
img : # the path for the hero image, from the image folder (if the image is directly on the image folder, just the filename is needed)
tags : [tags, of, your, post]
author : Your Name
github : username/reponame/ # set this to show a github button on the post
toc : yes # leave empty or erase for no table of contents
---Edit blogpost Anda menggunakan Markdown. Berikut ini adalah panduan yang bagus tentang cara menggunakannya.
Hapus gambar di dalam /assets/img/posts/ dan unggah gambar Anda sendiri untuk posting Anda.
Pastikan halaman github dihidupkan dalam pengaturan repositori, dan menunjuk ke cabang utama atau master (di mana Anda mengkloning repo ini).
Jika Anda terbiasa dengan Jekyll, maka struktur direktori Blog 2.0 Adam seharusnya tidak terlalu sulit untuk dinavigasi. Berikut ini beberapa sorotan dari perbedaan yang mungkin Anda perhatikan antara struktur direktori default. Informasi lebih lanjut tentang apa yang dilakukan folder dan file ini dapat ditemukan di situs dokumentasi Jekyll.
Adam Blog 2.0/
├── _includes # Theme includes
├── _layouts # Theme layouts (see below for details)
├── _posts # Where all your posts will go
├── assets # Style sheets and images are found here
| ├── css # Style sheets go here
| | └── _sass # Folder containing SCSS files
| | └── main.css # Main SCSS file
| | └── highlighter # Style sheet for code syntax highlighting
| └── img #
| └── posts # Images go here
├── _pages # Website pages (that are not posts)
├── _config.yml # Site settings
├── Gemfile # Ruby Gemfile for managing Jekyll plugins
├── index.html # Home page
├── LICENSE.md # License for this theme
├── README.md # Includes all of the documentation for this theme
├── feed.xml # Generates atom file which Jekyll points to
├── 404.html # custom and responsive 404 page
├── all-posts.json # database of all posts used for infinite scroll
├── ipfs-404.html # 404 page for IPFS
├── posts-by-tag.json # database of posts by tag
├── robots.txt # SEO crawlers exclusion file
├── search.json # database of posts used for search
└── sitemap.xml # automatically generated sitemap for search engines Untuk benar -benar memulai dari awal, cukup hapus semua file di folder _posts , assets/img/posts , dan tambahkan konten Anda sendiri. Segala sesuatu dalam file _config.yml dapat diedit sesuai dengan kebutuhan Anda. Juga ubah file favicon.ico ke favicon Anda sendiri.
Jika Anda memiliki penawaran tweetable di posting blog Anda dan ingin menampilkannya sebagai klik untuk tweet blok, Anda hanya perlu menggunakan tag <tweet></tweet> , semuanya di antara mereka akan dikonversi dalam kotak klik untuk tweet.
Dimungkinkan untuk melacak statistik situs Anda melalui Google Analytics. Mirip dengan Disqus, Anda harus membuat akun untuk Google Analytics, dan memasukkan ID Google yang benar untuk situs Anda di bawah google-ID dalam file _config.yml . Informasi lebih lanjut tentang cara mengatur Google Analytics.
Atom didukung secara default melalui jekyll-feed. Dengan jekyll-feed, Anda dapat mengatur variabel konfigurasi seperti 'judul', 'deskripsi', dan 'penulis', dalam file _config.yml .
File umpan atom Anda akan ditayangkan di https://your.site/feed.xml contoh.
Semua ikon media sosial adalah milik Font Awesome. Anda dapat mengubah ikon mana yang muncul, serta akun yang mereka tautkan, dalam file _config.yml .
Adam Blog 2.0 keluar dari kotak dengan Mathjax, yang memungkinkan Anda untuk menampilkan persamaan matematika dalam posting Anda melalui penggunaan lateks. Cukup tambahkan Mathjax: yes di frontmatter posting Anda.
< p style = " text-align : center " >
( theta _ {t+1} = theta _ {t} - dfrac{eta}{sqrt{hat{v} _ t} + epsilon} hat{m} _ t ) .
</ p >
Adam Blog 2.0 menyediakan sorot sintaks melalui blok kode berpagar. Sintaks Sorot memungkinkan Anda untuk menampilkan kode sumber dalam berbagai warna dan font tergantung pada bahasa pemrograman apa yang sedang ditampilkan. Anda dapat menemukan daftar lengkap bahasa pemrograman yang didukung di sini. Pilihan lain adalah menyematkan kode Anda melalui GIST.
Anda dapat memilih tema warna untuk sorotan sintaks dalam file _config.yml :
highlight_theme : syntax-base16.monokai.dark # select a theme for the code highlighterLihat direktori highlighter untuk referensi pada opsi.
Jekyll menawarkan dukungan untuk Markdown rasa GitHub, yang memungkinkan Anda untuk memformat posting Anda menggunakan sintaks Markdown.
Lihatlah dokumen Jekyll untuk info lebih lanjut tentang cara mendapatkan hasil maksimal dari Jekyll. File semua bug/permintaan fitur di Jekyll's Github Repo. Jika Anda memiliki pertanyaan, Anda dapat menanyakannya di Jekyll Talk.
Jika Anda ingin membuat permintaan fitur, atau melaporkan bug atau kesalahan ketik dalam dokumentasi, maka silakan kirimkan masalah GitHub. Jika Anda ingin memberikan kontribusi, maka jangan ragu untuk mengirimkan permintaan tarik - sebagai bonus, saya akan mengkredit semua kontributor di bawah ini! Jika ini adalah permintaan tarik pertama Anda, mungkin akan membantu untuk membaca pada aliran GitHub terlebih dahulu.
Adam Blog 2.0 telah dirancang sebagai basis bagi pengguna untuk menyesuaikan dan sesuai dengan kebutuhan unik mereka sendiri. Harap ingat ini saat meminta fitur dan/atau mengirimkan permintaan tarik. Beberapa contoh perubahan yang ingin saya lihat adalah hal -hal yang akan membuat situs lebih mudah digunakan, atau cara yang lebih baik dalam melakukan sesuatu. Harap hindari perubahan yang tidak menguntungkan sebagian besar pengguna.
Tema ini benar -benar gratis dan perangkat lunak open source. Anda dapat menggunakannya sesuka Anda, karena didistribusikan di bawah lisensi MIT. Jika Anda mengalami masalah, ada pertanyaan atau saran, jangan ragu untuk mengajukan masalah GitHub.
