AboutMe is a simple plugin to show some information about yourself, with a nice picture, your name, your title/job and a description. You can also add links to your social network pages (Twitter, Facebook, GitHub, Google Plus, LinkedIn, Instagram).
#Features
- Pick an avatar, either from your computer or from gravatar
- Let your visitors know a bit more about yourself, give your name, title/job and a nice description
- Add links to your social network pages (Including: Twitter, Facebook, Google Plus, GitHub, LinkedIn, Instagram). It uses FontAwesome icons, if your theme already loads it, you don't need to enable the option in the plugin configuration
- Add other social network pages
- Add h-card microformats to your homepage to help re-decentralize the Web with the Indieweb principles.
Installing the AboutMe plugin can be done in one of two ways. GPM (Grav Package Manager) installation method enables you to quickly and easily install the plugin with a simple terminal command, while the manual method enables you to do so via a zip file.
The simplest way to install this plugin is via the Grav Package Manager (GPM) through your system's Terminal (also called the command line). From the root of your Grav install type:
bin/gpm install aboutme
This will install the AboutMe plugin into your /user/plugins
directory within Grav. Its files can be found under /your/site/grav/user/plugins/aboutme
.
To install this plugin, just download the zip version of this repository and unzip it under /your/site/grav/user/plugins
. Then, rename the folder to aboutme
. You can find these files either on GitHub or via GetGrav.org.
You should now have all the plugin files under
/your/site/grav/user/plugins/aboutme
NOTE: This plugin is a modular component for Grav which requires Grav, the Error and Problems plugins, and a theme to be installed in order to operate.
To effectively use the plugin, you first need to create an override config. To do so, create the folder user/config/plugins
(if it doesn't exist already) and copy the [aboutme.yaml][aboutme] config file in there.
enabled: true # Activate the plugin
built_in_css: true # Use the default CSS
name: 'Santa Claus' # Your full name
title: 'Present Giver' # Your title/job
description: 'Santa Claus, Saint Nicholas, Saint Nick, Father Christmas, Kris Kringle, Santy, or simply Santa is a figure with legendary, historical and folkloric origins who, in many Western cultures, is said to bring gifts to the homes of good children on 24 December, the night before Christmas Day. The modern figure of Santa Claus is derived from the British figure of Father Christmas, the Dutch figure of Sinterklaas, and Saint Nicholas, the historical Greek bishop and gift-giver of Myra. During the Christianization of Germanic Europe, this figure may also have absorbed elements of the god Odin, who was associated with the Germanic pagan midwinter event of Yule and led the Wild Hunt, a ghostly procession through the sky' # Tell us a bit about yourself
enable_item_authorship: false # Enable/disable authorship information on items (such as blog articles)
display_item_authorship: false # Show/hide authorship information on items. Hiding them makes them machine-parsable while invisible to humans (for design concerns).
picture_src: user/plugins/aboutme/assets/avatars/santa.jpg # The path of your avatar, I recommand to use the admin plugin and go to the plugin configuration so you can upload your avatar there, the path will be filled for you.
gravatar:
enabled: false # Enables gravatar, it will override picture_src option
email: "example@test.com" # The email address your gravatar is attached to
size: 100 # The size of your gravatar
social_pages:
enabled: true # Enables social network pages
display: true # Show/hide social pages. Hiding them makes them machine-parsable while invisible to humans (for design concerns).
show_text: false # Displays description text for social pages
use_font_awesome: false # Use FontAwesome, enable this option only if FontAwesome is not loaded by your theme or another plugin
pages: # Your social network pages here ! Change the order at will by changing the default position value. You can also change the font icon and the title
facebook:
icon: facebook-official
title: Facebook
position: 1
twitter:
icon: twitter
title: Twitter
position: 2
google_plus:
icon: google-plus-square
title: Google+
position: 3
github:
icon: github
title: GitHub
position: 4
linkedin:
icon: linkedin-square
title: LinkedIn
position: 5
instagram:
icon: instagram
title: Instagram
position: 6
By creating the configuration file: user/config/plugins/aboutme.yaml
you have effectively created a site-wide configuration for AboutMe.
If you use the Admin Plugin you can directly change the configuration for this plugin in the admin control panel.
In order to do that, you have to be sure the social network you want to add has an icon available in FontAwesome. You can check here
For exemple you have a Pinterest account, FontAwesome offers you 3 icons, pinterest
, pinterest-p
and pinterest-square
. Choose one that suits you and add it to your user/config/plugins/aboutme.yaml
in the pages
section like this:
social_pages:
enabled: true
use_font_awesome: false
pages:
twitter:
icon: twitter
title: Twitter
position: 1
url: https://twitter.com/myaccount
pinterest:
icon: pinterest-square # You can replace pinterest-square by pinterest or pinterest-p depending on which icon you want
title: Pinterest # Change the title if you don't like this one
position: 2 # Position the link will appear at
url: https://www.pinterest.com/mylogin/ # Your Pinterest account link
It's pretty straight forward actually, just include the partial template from the plugin wherever you want it to show in your page.
{% include 'partials/aboutme.html.twig' %}
If you'd like to add your social media accounts, add to your template:
{% if config.plugins.aboutme.enable and config.plugins.aboutme.enable_social %}
{% include 'partials/aboutme_social.html.twig' %}
For example, for integration within Antimatter's sidebar, add to the `partials/sidebar.html.twig:
{% if config.plugins.aboutme.enabled %}
<div class="sidebar-content">
{% include 'partials/aboutme_social.html.twig' %}
</div>
{% endif %}
To add authorship information on published items (such as blog articles), you can use the `partials/aboutme_inline.html.twig' template:
{% include 'partials/aboutme_inline.html.twig' %}
For example, for use within Antimatter's blogging template, add the following snippet (e.g. before taxonomy links) to partials/blog_item.html.twig
:
{% if config.plugins.aboutme.enabled %}
{% include 'partials/aboutme_inline.html.twig' %}
{% endif %}
Translation strings are available in languages.yaml
. Don't hesitate to send a pull-request with more or better translations.
As development for AboutMe continues, new versions may become available that add additional features and functionality, improve compatibility with newer Grav releases, and generally provide a better user experience. Updating AboutMe is easy, and can be done through Grav's GPM system, as well as manually.
The simplest way to update this plugin is via the Grav Package Manager (GPM). You can do this with this by navigating to the root directory of your Grav install using your system's Terminal (also called command line) and typing the following:
bin/gpm update aboutme
This command will check your Grav install to see if your AboutMe plugin is due for an update. If a newer release is found, you will be asked whether or not you wish to update. To continue, type y
and hit enter. The plugin will automatically update and clear Grav's cache.
Note: Any changes you have made to any of the files listed under this directory will also be removed and replaced by the new set. Any files located elsewhere (for example a YAML settings file placed in
user/config/plugins
) will remain intact.