README.rst 3.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. tag_cloud
  2. =========
  3. This plugin generates a tag-cloud.
  4. Installation
  5. ------------
  6. In order to use to use this plugin, you have to edit(*) or create(+) the following files::
  7. blog/
  8. ├── pelicanconf.py *
  9. ├── content
  10. ├── plugins +
  11. │ └── tag_cloud.py +
  12. └── themes
  13. └── mytheme
  14. ├── templates
  15. │ └── base.html *
  16. └── static
  17. └── css
  18. └── style.css *
  19. In **pelicanconf.py** you have to activate the plugin::
  20. PLUGIN_PATHS = ["plugins"]
  21. PLUGINS = ["tag_cloud"]
  22. Into your **plugins** folder, you should add tag_cloud.py (from this repository).
  23. In your theme files, you should change **base.html** to apply formats (and sizes) defined in **style.css**, as specified in "Settings", below.
  24. Settings
  25. --------
  26. ================================================ =====================================================
  27. Setting name (followed by default value) What does it do?
  28. ================================================ =====================================================
  29. ``TAG_CLOUD_STEPS = 4`` Count of different font sizes in the tag
  30. cloud.
  31. ``TAG_CLOUD_MAX_ITEMS = 100`` Maximum number of tags in the cloud.
  32. ``TAG_CLOUD_SORTING = 'random'`` The tag cloud ordering scheme. Valid values:
  33. random, alphabetically, alphabetically-rev, size and
  34. size-rev
  35. ``TAG_CLOUD_BADGE = True`` Optionnal setting : can bring **badges**, which mean
  36. say : display the number of each tags present
  37. on all articles.
  38. ================================================ =====================================================
  39. The default theme does not include a tag cloud, but it is pretty easy to add one::
  40. <ul class="tagcloud">
  41. {% for tag in tag_cloud %}
  42. <li class="tag-{{ tag.1 }}">
  43. <a href="{{ SITEURL }}/{{ tag.0.url }}">
  44. {{ tag.0 }}
  45. {% if TAG_CLOUD_BADGE %}
  46. <span class="badge">{{ tag.2 }}</span>
  47. {% endif %}
  48. </a>
  49. </li>
  50. {% endfor %}
  51. </ul>
  52. You should then also define CSS styles with appropriate classes (tag-1 to tag-N,
  53. where N matches ``TAG_CLOUD_STEPS``), tag-1 being the most frequent, and
  54. define a ``ul.tagcloud`` class with appropriate list-style to create the cloud.
  55. You should copy/paste this **badge** CSS rule ``ul.tagcloud .list-group-item <span>.badge``
  56. if you're using ``TAG_CLOUD_BADGE`` setting. (this rule, potentially long , is suggested to avoid
  57. conflicts with CSS libs as twitter Bootstrap)
  58. For example::
  59. ul.tagcloud {
  60. list-style: none;
  61. padding: 0;
  62. }
  63. ul.tagcloud li {
  64. display: inline-block;
  65. }
  66. li.tag-1 {
  67. font-size: 150%;
  68. }
  69. li.tag-2 {
  70. font-size: 120%;
  71. }
  72. ...
  73. ul.tagcloud .list-group-item <span>.badge {
  74. background-color: grey;
  75. color: white;
  76. }
  77. By default the tags in the cloud are sorted randomly, but if you prefers to have it alphabetically use the `alphabetically` (ascending) and `alphabetically-rev` (descending). Also is possible to sort the tags by it's size (number of articles with this specific tag) using the values `size` (ascending) and `size-rev` (descending).