Wordpress 101

02-03-2021 / Edit on Github

In this note, wp theme's components are supposed to be placed in folder wp-thi.

👉 Note: All notes of Wordpress.

Tools #

General #

  • Theme is placed at ./wp-content/themes/
  • WP needs at least 2 files to exist: style.css and index.php.
  • Admin page wpsite.com/wp-admin.

WP theme components #


echo get_bloginfo('template_directory'); // theme directory


get_bloginfo( 'wpurl' ) // url
get_bloginfo( 'name' ) // name
get_bloginfo( 'description' ) // description


the_content() // content
the_title() // title
the_date() // date
the_author() // author


the_author_meta( 'description' ); // description

KaTeX for Wordpress #

I don't like 2 available plugins (WP-KaTeX and KaTeX). The former doesn't support dollar symbols ($) to display equations, the latter doesn't support inline math.

We will use directly KaTeX.

  1. Put below code inside <head></head>,

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
    <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
    <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js" integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous" onload="renderMathInElement(document.body, {delimiters: [{left: '$$', right: '$$', display: true},{left: '$', right: '$', display: false}]});"></script>
  2. In Wordpress, for display mode, switch to html block. For inline mode, use $$ as usual.

Notes with this notation aren't good enough. They are being updated.