Tema Jekyll yang sederhana, bersih, dan responsif untuk akademisi. Jika Anda menyukai temanya, beri bintang!
Ingin mempelajari lebih lanjut tentang Jekyll? Lihat tutorial ini. Kenapa Jekyll? Baca postingan blog Andrej Karpathy!
Untuk panduan langsung tentang instalasi al-folio, lihat tutorial video keren dari salah satu anggota komunitas! ? ?
Cara yang lebih disukai untuk menggunakan templat ini adalah dengan mengklik Gunakan templat ini di atas daftar file. Kemudian, buat repositori baru di github.com:<your-username>/<your-repo-name>
. Jika Anda berencana mengunggah situs Anda ke <your-github-username>.github.io
, perhatikan bahwa nama repositori Anda harus <your-github-username>.github.io
atau <your-github-orgname>.github.io
, seperti yang dinyatakan dalam dokumen halaman GitHub. Untuk informasi selengkapnya tentang cara menerapkan situs Anda, periksa bagian Penerapan di bawah. Setelah Anda membuat repositori baru, cukup unduh ke mesin Anda:
$ git clone [email protected]: < your-username > / < your-repo-name > .git
$ cd < your-repo-name >
Menggunakan Docker untuk menginstal dependensi Jekyll dan Ruby adalah cara termudah.
Anda perlu mengambil langkah-langkah berikut untuk mengaktifkan dan menjalankan al-folio
di mesin lokal Anda:
$ docker compose pull
$ docker compose up
Perhatikan bahwa saat Anda menjalankannya untuk pertama kali, ia akan mengunduh gambar buruh pelabuhan berukuran sekitar 400MB.
Sekarang, silakan sesuaikan tema sesuka Anda (jangan lupa ganti namanya!). Setelah selesai, Anda dapat menggunakan perintah yang sama ( docker compose up
) untuk merender halaman web dengan semua perubahan yang Anda lakukan. Juga, pastikan untuk melakukan perubahan akhir Anda.
Untuk mengubah nomor port, Anda dapat mengedit file
docker-compose.yml
.
Catatan: pendekatan ini hanya diperlukan jika Anda ingin membuat al-folio versi lama atau yang sangat khusus.
Bangun dan jalankan image buruh pelabuhan baru menggunakan:
$ docker compose up --build
Jika Anda ingin mengupdate jekyll, menginstal paket ruby baru, dll., yang harus Anda lakukan adalah membuat image lagi menggunakan argumen
--force-recreate
di akhir perintah sebelumnya! Ini akan mengunduh Ruby dan Jekyll dan menginstal semua paket Ruby lagi dari awal.
Jika Anda ingin menggunakan versi buruh pelabuhan tertentu, Anda dapat melakukannya dengan mengubah tag latest
menjadi your_version
di docker-compose.yaml
. Misalnya, Anda mungkin membuat situs web pada v0.10.0
dan ingin tetap menggunakannya.
Dengan asumsi Anda telah menginstal Ruby dan Bundler di sistem Anda ( petunjuk: untuk kemudahan mengelola permata Ruby, pertimbangkan untuk menggunakan rbenv ), dan juga Python dan pip ( petunjuk: untuk kemudahan mengelola paket python, pertimbangkan untuk menggunakan lingkungan virtual, seperti venv atau conda . Jika Anda hanya akan menggunakan jupyter
, Anda dapat menggunakan pipx ).
$ bundle install
# assuming pip is your Python package manager
$ pip install jupyter
$ bundle exec jekyll serve --lsi
Sekarang, silakan sesuaikan tema sesuka Anda (jangan lupa ganti namanya!). Setelah Anda selesai, lakukan perubahan terakhir Anda.
Menyebarkan situs web Anda ke Halaman GitHub adalah opsi paling populer. Mulai versi v0.3.5, al-folio akan secara otomatis menyebarkan ulang halaman web Anda setiap kali Anda memasukkan perubahan baru ke repositori Anda!
Untuk halaman web pribadi dan organisasi:
<your-github-username>.github.io
atau <your-github-orgname>.github.io
._config.yml
, setel url
ke https://<your-github-username>.github.io
dan biarkan baseurl
kosong.<your-github-username>.github.io
.Untuk halaman proyek:
_config.yml
, setel url
ke https://<your-github-username>.github.io
dan baseurl
ke /<your-repository-name>/
.<your-github-username>.github.io/<your-repository-name>/
.Untuk mengaktifkan penerapan otomatis:
master
, repositori Anda sekarang harus memiliki cabang gh-pages
yang baru dibuat.gh-pages
( BUKAN ke master
). Untuk detail selengkapnya, lihat Mengonfigurasi sumber penerbitan untuk situs Halaman GitHub Anda. Jika Anda menyimpan situs Anda di cabang lain, buka .github/workflows/deploy.yml
di cabang tempat Anda menyimpan situs web Anda dan ubah on->push->branches dan on->pull_request->branches ke cabang tempat Anda menyimpan situs web Anda pada. Ini akan memicu aksi tarik/dorongan pada cabang tersebut. Tindakan tersebut kemudian akan menyebarkan situs web di cabang asal pemicunya.
Jika Anda perlu menerapkan ulang situs web Anda secara manual ke halaman GitHub, buka Tindakan, klik "Terapkan" di sidebar kiri, lalu "Jalankan alur kerja".
Jika Anda memutuskan untuk tidak menggunakan Halaman GitHub dan menghosting halaman Anda di tempat lain, jalankan saja:
$ bundle exec jekyll build --lsi
yang akan (kembali) menghasilkan halaman web statis di folder _site/
. Kemudian copy saja isi direktori _site/
ke server hosting Anda.
Jika Anda juga ingin menghapus kelas css yang tidak digunakan dari file Anda, jalankan:
$ purgecss -c purgecss.config.js
yang akan menggantikan file css di folder _site/assets/css/
dengan file css yang telah dibersihkan.
Catatan: Pastikan untuk mengatur bidang url
dan baseurl
dengan benar di _config.yml
sebelum membuat halaman web. Jika Anda menyebarkan laman web ke your-domain.com/your-project/
, Anda harus menyetel url: your-domain.com
dan baseurl: /your-project/
. Jika Anda menerapkan langsung ke your-domain.com
, biarkan baseurl
kosong.
Catatan: Jangan mencoba menggunakan metode ini kecuali Anda tahu apa yang Anda lakukan (pastikan Anda memahami sumber penerbitan). Pendekatan ini memungkinkan untuk memiliki kode sumber situs web dalam satu repositori dan versi penerapan di repositori berbeda.
Anggaplah sumber penerbitan situs web Anda adalah subdirektori publishing-source
dari repositori berversi git yang dikloning di bawah $HOME/repo/
. Untuk situs pengguna, ini bisa berupa $HOME/<user>.github.io
.
Pertama, dari direktori repo penerapan, periksa cabang git yang menghosting sumber penerbitan Anda.
Kemudian dari direktori sumber situs web (biasanya tiruan garpu al-folio Anda):
$ bundle exec jekyll build --lsi --destination $HOME /repo/publishing-source
Ini akan menginstruksikan jekyll untuk menyebarkan situs web di bawah $HOME/repo/publishing-source
.
Catatan: Jekyll akan membersihkan $HOME/repo/publishing-source
sebelum membangun!
Kutipan di bawah ini diambil langsung dari dokumen konfigurasi jekyll:
Folder tujuan dibersihkan pada pembuatan situs
Konten
<destination>
secara otomatis dibersihkan, secara default, saat situs dibuat. File atau folder yang tidak dibuat oleh situs Anda akan dihapus. Beberapa file dapat dipertahankan dengan menentukannya dalam arahan konfigurasi<keep_files>
.Jangan gunakan lokasi penting untuk
<destination>
; sebagai gantinya, gunakan itu sebagai area pementasan dan salin file dari sana ke server web Anda.
Jika $HOME/repo/publishing-source
berisi file yang Anda ingin jekyll biarkan saja, tentukan file tersebut di bawah keep_files
di _config.yml
. Dalam konfigurasi defaultnya, al-folio akan menyalin README.md
tingkat atas ke sumber penerbitan. Jika Anda ingin mengubah perilaku ini, tambahkan README.md
di bawah exclude
di _config.yml
.
Catatan: Jangan jalankan jekyll clean
di repo sumber penerbitan Anda karena ini akan mengakibatkan seluruh direktori terhapus, terlepas dari konten keep_files
di _config.yml
.
Jika Anda menginstal al-folio seperti dijelaskan di atas, Anda dapat mengonfigurasi tindakan GitHub untuk menyinkronkan repositori Anda secara otomatis dengan tema versi terbaru.
Buka Pengaturan -> Tindakan -> Umum -> Izin alur kerja, berikan izin Baca dan tulis ke Tindakan GitHub, centang "Izinkan Tindakan GitHub membuat dan menyetujui permintaan tarik", dan simpan perubahan Anda.
Lalu pergi ke Tindakan -> Alur kerja baru -> siapkan alur kerja sendiri, atur alur kerja berikut dan lakukan perubahan Anda:
name : Sync from template
on :
# cronjob trigger
schedule :
- cron : " 0 0 1 * * "
# manual trigger
workflow_dispatch :
jobs :
repo-sync :
runs-on : ubuntu-latest
steps :
# To use this repository's private action, you must check out the repository
- name : Checkout
uses : actions/checkout@v3
- name : actions-template-sync
uses : AndreasAugustin/[email protected]
with :
github_token : ${{ secrets.GITHUB_TOKEN }}
source_repo_path : alshedivat/al-folio
upstream_branch : master
Anda akan menerima permintaan penarikan dalam repositori Anda jika ada beberapa perubahan yang tersedia di templat.
Opsi lainnya adalah memperbarui kode Anda secara manual dengan mengikuti langkah-langkah di bawah ini:
# Assuming the current directory is <your-repo-name>
$ git remote add upstream https://github.com/alshedivat/al-folio.git
$ git fetch upstream
$ git rebase v0.9.0
Jika Anda telah banyak menyesuaikan versi sebelumnya, mungkin akan lebih sulit untuk melakukan upgrade. Anda masih dapat mengikuti langkah-langkah di atas, tetapi git rebase
mungkin mengakibatkan konflik penggabungan yang harus diselesaikan. Lihat manual git rebase dan cara mengatasi konflik untuk informasi lebih lanjut. Jika rebasing terlalu rumit, kami sarankan untuk menginstal ulang tema versi baru dari awal dan melakukan porting pada konten Anda dan perubahan dari versi sebelumnya secara manual.
Berikut adalah beberapa pertanyaan yang sering diajukan. Jika Anda memiliki pertanyaan lain, silakan bertanya melalui Diskusi.
T: Setelah saya membuat repositori baru dari templat ini dan menyiapkan repo, saya mendapatkan kesalahan penerapan. Bukankah situs web seharusnya diterapkan secara otomatis dengan benar?
J: Ya, jika Anda menggunakan rilis v0.3.5
atau lebih baru, situs web akan di-deploy ulang secara otomatis dan benar segera setelah Anda melakukan commit pertama. Silakan lakukan beberapa perubahan (misalnya, ubah info situs web Anda di _config.yml
), komit, dan dorong. Pastikan untuk mengikuti petunjuk penerapan di bagian sebelumnya. (Masalah yang relevan: 209.)
T: Saya menggunakan domain khusus (misalnya foo.com
). Domain khusus saya menjadi kosong di pengaturan repositori setelah setiap penerapan. Bagaimana cara memperbaikinya?
J: Anda perlu menambahkan file CNAME
ke cabang master
atau source
repositori Anda. File tersebut harus berisi nama domain khusus Anda. (Masalah yang relevan: 130.)
T: Halaman web saya berfungsi secara lokal. Namun setelah diterapkan, ia gagal membuat dan membuang Unknown tag 'toc'
. Bagaimana cara memperbaikinya?
J: Pastikan Anda mengikuti petunjuk penerapan di bagian sebelumnya. Anda seharusnya menyetel cabang penerapan ke gh-pages
. (Masalah terkait: 1438.)
T: Halaman web saya berfungsi secara lokal. Namun setelah diterapkan, itu tidak ditampilkan dengan benar (CSS dan JS tidak dimuat dengan benar). Bagaimana cara memperbaikinya?
J: Pastikan untuk menentukan jalur url
dan baseurl
dengan benar di _config.yml
. Setel url
ke https://<your-github-username>.github.io
atau ke https://<your.custom.domain>
jika Anda menggunakan domain khusus. Jika Anda menggunakan situs web pribadi atau organisasi, biarkan baseurl
kosong. Jika Anda menerapkan halaman proyek, atur baseurl: /<your-project-name>/
. Jika semua langkah sebelumnya dilakukan dengan benar, yang hilang hanyalah browser Anda mengambil kembali stylesheet situs.
T: Umpan atom tidak berfungsi. Mengapa?
J: Pastikan untuk menentukan jalur url
dan baseurl
dengan benar di _config.yml
. Plugin RSS Feed berfungsi dengan bidang yang diatur dengan benar: title
, url
, description
dan author
. Pastikan untuk mengisinya dengan cara yang benar dan coba lagi.
T: Situs saya tidak berfungsi saat saya related_blog_posts
. Mengapa?
A: Ini mungkin karena plugin classifier reborn, yang digunakan untuk menghitung postingan terkait. Jika kesalahan menyatakan Liquid Exception: Zero vectors can not be normalized...
, itu berarti tidak dapat menghitung postingan terkait untuk postingan tertentu. Hal ini biasanya disebabkan oleh postingan blog yang kosong atau minim tanpa kata-kata yang bermakna (yaitu hanya kata-kata penghenti) atau bahkan karakter tertentu yang Anda gunakan dalam postingan Anda. Selain itu, kalkulus untuk postingan serupa dibuat untuk setiap post
, artinya setiap halaman yang menggunakan layout: post
, termasuk pengumumannya. Untuk mengubah perilaku ini, cukup related_posts: false
ke bagian depan halaman tempat Anda tidak ingin menampilkan postingan terkait.
T: Saat mencoba menerapkan, ia meminta kredensial masuk github, yang mana github menonaktifkan autentikasi kata sandi dan keluar dengan kesalahan. Bagaimana cara memperbaikinya?
A: Buka file .git/config menggunakan editor pilihan Anda. Ubah bagian https
dari variabel url
menjadi ssh
. Coba terapkan lagi.
Halaman publikasi Anda dihasilkan secara otomatis dari bibliografi BibTex Anda. Cukup edit _bibliography/papers.bib
. Anda juga dapat menambahkan file *.bib
baru dan menyesuaikan tampilan publikasi sesuka Anda dengan mengedit _pages/publications.md
.
Dalam publikasi, entri penulis untuk Anda sendiri diidentifikasi oleh array string scholar:last_name
dan array string scholar:first_name
di _config.yml
:
scholar :
last_name : [Einstein]
first_name : [Albert, A.]
Jika entri cocok dengan salah satu bentuk nama belakang dan nama depan, maka entri tersebut akan digarisbawahi. Simpan informasi meta tentang rekan penulis Anda di _data/coauthors.yml
dan Jekyll akan menyisipkan tautan ke halaman web mereka secara otomatis. Format data rekan penulis di _data/coauthors.yml
adalah sebagai berikut,
" Adams " :
- firstname : ["Edwin", "E.", "E. P.", "Edwin Plimpton"]
url : https://en.wikipedia.org/wiki/Edwin_Plimpton_Adams
" Podolsky " :
- firstname : ["Boris", "B.", "B. Y.", "Boris Yakovlevich"]
url : https://en.wikipedia.org/wiki/Boris_Podolsky
" Rosen " :
- firstname : ["Nathan", "N."]
url : https://en.wikipedia.org/wiki/Nathan_Rosen
" Bach " :
- firstname : ["Johann Sebastian", "J. S."]
url : https://en.wikipedia.org/wiki/Johann_Sebastian_Bach
- firstname : ["Carl Philipp Emanuel", "C. P. E."]
url : https://en.wikipedia.org/wiki/Carl_Philipp_Emanuel_Bach
Jika entri cocok dengan salah satu kombinasi nama belakang dan nama depan, entri tersebut akan disorot dan ditautkan ke url yang disediakan.
Ada beberapa kata kunci bibtex khusus yang dapat Anda gunakan untuk memengaruhi cara entri ditampilkan di halaman web:
abbr
: Menambahkan singkatan di sebelah kiri entri. Anda dapat menambahkan link ke dalamnya dengan membuat file venue.yaml di folder _data dan menambahkan entri yang cocok.abstract
: Menambahkan tombol "Abs" yang memperluas bidang teks tersembunyi ketika diklik untuk menampilkan teks abstrakarxiv
: Menambahkan tautan ke situs web Arxiv (Catatan: hanya tambahkan pengidentifikasi arxiv di sini - tautan dibuat secara otomatis)bibtex_show
: Menambahkan tombol "Bib" yang memperluas bidang teks tersembunyi dengan entri bibliografi lengkaphtml
: Menyisipkan tombol "HTML" yang mengarahkan ke tautan yang ditentukan penggunapdf
: Menambahkan tombol "PDF" yang mengarahkan ke file tertentu (jika tautan lengkap tidak ditentukan, file akan dianggap ditempatkan di direktori /assets/pdf/)supp
: Menambahkan tombol "Supp" ke file tertentu (jika tautan lengkap tidak ditentukan, file akan dianggap ditempatkan di direktori /assets/pdf/)blog
: Menambahkan tombol "Blog" yang mengarahkan ke tautan yang ditentukancode
: Menambahkan tombol "Kode" yang mengarahkan ke tautan yang ditentukanposter
: Menambahkan tombol "Poster" yang mengarahkan ke file tertentu (jika tautan lengkap tidak ditentukan, file akan dianggap ditempatkan di direktori /assets/pdf/)slides
: Menambahkan tombol "Slide" yang mengarahkan ke file tertentu (jika tautan lengkap tidak ditentukan, file akan dianggap ditempatkan di direktori /assets/pdf/)website
: Menambahkan tombol "Situs Web" yang mengarahkan ke tautan yang ditentukanaltmetric
: Menambahkan lencana Altmetrik (Catatan: jika DOI diberikan, gunakan saja true
, jika tidak, tambahkan saja pengidentifikasi altmetrik di sini - tautan dibuat secara otomatis)dimensions
: Menambahkan lencana Dimensi (Catatan: jika DOI atau PMID diberikan, gunakan saja true
, jika tidak, hanya tambahkan pengidentifikasi Dimensi di sini - tautan dibuat secara otomatis)Anda dapat menerapkan tombol Anda sendiri dengan mengedit file bib.html.
Tema Jekyll ini mengimplementasikan collections
yang memungkinkan Anda membagi karya Anda ke dalam beberapa kategori. Tema ini hadir dengan dua koleksi default: news
dan projects
. Item dari kumpulan news
secara otomatis ditampilkan di halaman beranda. Item dari koleksi projects
ditampilkan pada kisi responsif di halaman proyek.
Anda dapat dengan mudah membuat koleksi, aplikasi, cerita pendek, kursus, atau apa pun karya kreatif Anda sendiri. Untuk melakukannya, edit koleksi di file _config.yml
, buat folder yang sesuai, dan buat halaman arahan untuk koleksi Anda, mirip dengan _pages/projects.md
.
al-folio hadir dengan tata letak bergaya untuk halaman dan posting blog.
Tema ini memungkinkan Anda membuat postingan blog dengan gaya distill.pub:
Untuk lebih jelasnya cara membuat postingan bergaya sulingan menggunakan tag <d-*>
, silakan lihat contohnya.
al-folio mendukung penyusunan huruf matematika cepat melalui MathJax dan penyorotan sintaks kode menggunakan gaya GitHub:
Pemformatan foto dibuat sederhana menggunakan sistem grid Bootstrap. Buat kisi-kisi indah dengan mudah dalam postingan blog dan halaman proyek Anda:
al-folio menggunakan github-readme-stats dan github-profile-trophy untuk menampilkan repositori GitHub dan statistik pengguna di halaman /repositories/
.
Edit _data/repositories.yml
dan ubah daftar github_users
dan github_repos
untuk menyertakan profil GitHub dan repositori Anda ke halaman /repositories/
.
Anda juga dapat menggunakan kode berikut untuk menampilkan ini di halaman lain.
<!-- code for GitHub users -->
{% if site.data.repositories.github_users %}
< div class =" repositories d-flex flex-wrap flex-md-row flex-column justify-content-between align-items-center " >
{% for user in site.data.repositories.github_users %}
{% include repository/repo_user.html username=user %}
{% endfor %}
</ div >
{% endif %}
<!-- code for GitHub trophies -->
{% if site.repo_trophies.enabled %}
{% for user in site.data.repositories.github_users %}
{% if site.data.repositories.github_users.size > 1 %}
< h4 > {{ user }} </ h4 >
{% endif %}
< div class =" repositories d-flex flex-wrap flex-md-row flex-column justify-content-between align-items-center " >
{% include repository/repo_trophies.html username=user %}
</ div >
{% endfor %}
{% endif %}
<!-- code for GitHub repositories -->
{% if site.data.repositories.github_repos %}
< div class =" repositories d-flex flex-wrap flex-md-row flex-column justify-content-between align-items-center " >
{% for repo in site.data.repositories.github_repos %}
{% include repository/repo.html repository=repo %}
{% endfor %}
</ div >
{% endif %}
Berbagai warna tema yang indah telah dipilih untuk Anda pilih. Standarnya adalah ungu, tetapi Anda dapat dengan cepat mengubahnya dengan mengedit variabel --global-theme-color
di file _sass/_themes.scss
. Variabel warna lainnya juga tercantum di sana. Pilihan warna tema stok yang tersedia dapat ditemukan di _sass/_variables.scss
. Anda juga dapat menambahkan warna Anda sendiri ke file ini dengan memberi nama pada masing-masing warna untuk kemudahan penggunaan di seluruh template.
al-folio mendukung gambar pratinjau di media sosial. Untuk mengaktifkan fungsi ini, Anda perlu menyetel serve_og_meta
ke true
di _config.yml
Anda. Setelah Anda melakukannya, semua halaman situs Anda akan menyertakan data Open Graph di elemen head HTML.
Anda kemudian perlu mengonfigurasi gambar apa yang akan ditampilkan di pratinjau media sosial situs Anda. Ini dapat dikonfigurasi per halaman, dengan mengatur variabel halaman og_image
. Jika variabel ini tidak disetel untuk satu halaman, maka tema akan kembali ke variabel og_image
seluruh situs, yang dapat dikonfigurasi di _config.yml
Anda. Baik dalam kasus khusus laman maupun seluruh situs, variabel og_image
perlu menyimpan URL gambar yang ingin Anda tampilkan di pratinjau media sosial.
Ini menghasilkan umpan Atom (seperti RSS) dari posting Anda, berguna untuk pembaca Atom dan RSS. Umpan dapat dijangkau hanya dengan mengetik setelah beranda Anda /feed.xml
. Misalnya dengan asumsi titik mount situs web Anda adalah folder utama, Anda dapat mengetikkan yourusername.github.io/feed.xml
Secara default, akan ada bagian postingan terkait di bagian bawah postingan blog. Ini dihasilkan dengan memilih max_related
postingan terbaru yang memiliki setidaknya tag min_common_tags
yang sama dengan postingan saat ini. Jika Anda tidak ingin menampilkan postingan terkait pada postingan tertentu, cukup related_posts: false
di bagian depan postingan. Jika Anda ingin menonaktifkannya untuk semua postingan, cukup setel enabled
ke false di related_blog_posts
di _config.yml
.
Kontribusi pada al-folio sangat kami harapkan! Sebelum Anda memulai, harap lihat pedomannya.
Jika Anda ingin meningkatkan dokumentasi, menambahkan halaman web Anda ke daftar di bawah, atau memperbaiki sedikit ketidakkonsistenan atau bug, silakan kirimkan PR langsung ke master
. Untuk masalah/bug atau permintaan fitur yang lebih kompleks, silakan buka masalah menggunakan templat yang sesuai.
Kontributor kami yang paling aktif dipersilakan untuk bergabung dengan tim pengelola. Jika Anda tertarik, silakan hubungi!
Maruan | Rohan Deb Sarkar | Amir Pourmand | George |
Dibuat dengan kontrib.rocks.
Tema ini tersedia sebagai open source di bawah ketentuan Lisensi MIT.
Awalnya, al-folio didasarkan pada tema *folio (diterbitkan oleh Lia Bogoev dan di bawah lisensi MIT). Sejak itu, gayanya telah ditulis ulang secara penuh dan banyak fitur keren tambahan.