Posts in the “drupal” category

Drupal 8: How to put a View or Block between the Content and Comments

I’m not going to discuss this code much, but in short, the source code below is for a Drupal 8 preprocess_node function that I use to set variables for (a) a custom view and (b) a custom block. I set the variables in this function, and then display them in my node.html.twig file like this:

{{ similar_by_terms }}

and this:

How to configure Share Buttons by AddToAny with Drupal 8

As a quick “note to self,” to get the Share Buttons module by AddToAny working in Drupal 8, I followed these steps:

- install the AddToAny module
- configure permissions so i could work with it
    - admin/people/permissions
- configure AddToAny as desired
    - admin/config/services/addtoany
- create a block, add it to a region (such as Content)
    - i actually created a block, then modified
      my theme to show AddToAny between the Contents and
      the Comments

The key to getting AddToAny was knowing to go to admin/structure/block and then selecting “Place Block” to create an AddToAny block. Not knowing that I had to do that slowed me down for quite a while.

Help, my Drupal 8 database is huge

Earlier today I ran into a problem making a Drupal 8 database backup. I ran the usual mysqldump backup command, and when it kept running for a long time I decided to kill it, and then began investigating the problem. I knew that I had recently deleted all of the log records, and the Drupal cron task was running correctly, so something else was going on. In short, I found that my Drupal 8 database was huge.

I found this out by moving to the Drupal 8 MySQL database data directory, which on an Ubuntu Linux system is something like this:

/var/lib/mysql/drupal8

The last part of that path is the name of your database, so in this example my database is named drupal8. When I listed the files in this directory in order sorted by filesize, I noticed that a few of the files had grown huge. Here’s an abbreviated version of that directory listing:

108M  search_index.ibd
120M  cache_entity.ibd
268M  cache_data.ibd
1.6G  cache_dynamic_page_cache.ibd
3.4G  cache_render.ibd

As you can see, the Drupal 8 cache-related database tables had grown huge, with cache_dynamic_page_cache.ibd and cache_render.ibd being the two largest files by a large margin.

The short story is that I ran the drush cr command to clear all of the caches, then ran the du -sh command in the same directory, and it showed that the total size of the files had been reduced to about 500 MB. That still seems a little large, as a database backup with mysqldump is about 95 MB, but it’s much better than the 5.8 GB it was before I ran the drush command. (I haven’t looked into the reasons for this difference yet.)

How to look at MySQL database table size

I later learned that another way you can look at your MySQL database table size is with this MySQL command:

show table status;

If you’re using the mysql command line client you’ll need to select your database first:

use drupal8;

After that, the show table status command will show how large each table is in the data_length column output.

Summary

In summary, if your Drupal 8 database is huge, I hope this information is helpful. As I have learned, the things to do are (a) make sure your report logs aren’t huge, (b) make sure your cron task is running properly, and (c) check the size of the Drupal 8 cache-related tables. Actually, you might want to check those things in the reverse order, but those are the usual things that make Drupal database tables large.

Drupal 8: How to add custom styles to the CKEditor “Styles” drop-down menu

A nice thing about the CKEditor in Drupal 8 is that it’s easy to add your own custom styles to the CKEditor “Styles” drop-down menu. This is the menu in the CKEditor widget you see when you’re editing content at a URI such as node/add/blog, which I’m referring to in this image:

The Drupal 8 CKEditor Styles menu

As you can see from the next image, I’ve added several custom styles to my own CKEditor Styles drop-down menu:

My custom Drupal 8 CKEditor styles

What you can’t tell quite yet is that you can create two different types of custom styles in this menu:

  • Block styles, which affect an entire block, such as a <div>.
  • Inline styles, which affect a portion of content you select, such as one word, or a couple of words in a paragraph.

I’ll show how to create both of those in this tutorial.

Overview

Adding a new style to the CKEditor Styles drop-down menu is really just a two-step process:

  1. Add the desired style to your custom stylesheets, i.e., the stylesheets in your Drupal theme.
  2. Add the proper notation in the CKEditor configuration within the Drupal administration pages.

Step 1: Adding a style to your stylesheets

The first step is to add a desired style to your theme’s stylesheet(s). For example, I just had the need to add a new style that would (a) make an entire paragraph right-aligned, and (b) reduce its opacity. To accomplish this, I added this style to my theme’s main.css stylesheet:

p.opaque-misc-link {
    opacity: 0.35;
    text-align: right;
}

That’s all you have to do for this step, add whatever style you want to your theme’s stylesheet(s), as usual.

Step 2: Configure the CKEditor in Drupal

What you want to do in the next step is configure the CKEditor to recognize this style. In Drupal 8 you do this within the Drupal administration pages.

To do this, either go directly to the admin/config/content/formats URI, or follow these steps:

  • Click “Manage”
  • Click “Configuration”
  • Click “Text formats and editors”

Now, you need to select the “Text Format” that you want to configure. In my case I want to configure the CKEditor in the “Full HTML” text format, which I show here:

Choose your Text Format

To do this, click “Configure.” On the page that comes up, scroll down to the “Text editor” section. In my case, “CKEditor” is already chosen, but if you haven’t chosen the CKEditor already, you’ll need to do so now.

After you do this, scroll down a little bit until you see the “CKEditor plugin settings” section, as shown in this image:

CKEditor plugin settings

In this section, click the “Styles dropdown” tab, and you should see something like this:

My Drupal 8 CKEditor custom styles

You may not have anything in this textarea initially, but as you can see, I have nine styles in this area. Some of the styles are there because I was testing things, but I use all of these styles on a regular basis:

code|code
p.opaque-misc-link|misc link (paragraph)
span.filename|filename
span.directoryName|directoryName
span.uri|uri
span.url|url

This style is the one that corresponds to the style I just added to my stylesheet in Step 1:

p.opaque-misc-link|misc link (paragraph)

The way this works is that the text before the “|” symbol references the style in the stylesheet:

p.opaque-misc-link

and the text on the right side of the “|” is the text that will show up in the CKEditor “Styles” drop-down menu when you’re editing content. In my case this is the text I wanted to see in the drop-down menu:

misc link (paragraph)

As you can see in the image that I showed earlier, that text does appear in that menu:

My custom Drupal 8 CKEditor styles

Now, if you’re following with me, if you go ahead and scroll down and click, “Save configuration” here, you can then go back to an add/edit content URL, such as node/add/blog. When you do that, if you click on the CKEditor “Styles” menu, you should see your new style.

Block styles vs Inline styles

The Drupal 8 CKEditor “Styles dropdown” configuration area makes a distinction between (a) styles that affect a “block,” which is roughly something like a <div>, <p>, or other block tag, and (b) styles which affect a smaller region of text, such as one word, or a few words in a paragraph. Drupal 8 refers to the first type as a “Block style,” and the second type as an “Inline style.”

In the nine styles that I showed earlier, these lines will show up in the “Block style” section of the “Styles” drop-down menu:

h1|h1
h2|h2
h3|h3
p.opaque-misc-link|misc link (paragraph)

These styles show up in the “Inline styles” section of the “Styles” drop-down menu:

code|code
span.filename|filename
span.directoryName|directoryName
span.uri|uri
span.url|url

I found it necessary to include the word “span” before most of those inline styles. This was mostly a trial-and-error effort on my part, because when I used this text:

.filename|filename

and then tried to save the form, I got an error that said the syntax was wrong. After trying a few different things, I finally settled on this approach:

span.filename|filename

I use that CSS style to add a style to filenames, such as sites/default/settings.php. It’s possible that I could have also used this approach in that textarea:

p.filename|filename

but I thought the first approach was more accurate, and it works as desired.

Summary

I’ll be glad to write more about this if people are interested, but for now, I’ll just say that in summary, if you wanted to see how to add your own custom styles to the Drupal 8 CKEditor “Styles” drop-down menu, I hope this example is helpful.

A Drupal 7 db_insert query (SQL INSERT statement)

Drupal 7 database FAQ: How do I use the Drupal dbquery function to perform a SQL INSERT? (Or, what is the Drupal 7 dbinsert syntax?)

I didn't type db_query in that question by mistake. I just spent 45 minutes trying to use it for a Drupal 7 SQL INSERT, which of course I've now learned doesn't work.

In short, if you're looking for a Drupal 7 db_insert example that shows how to perform a SQL INSERT, and also happens to show some SQL Timestamp fields, here's a 'submit' function I'm currently writing:

A custom Drupal PHP block example

Drupal block FAQ - How do I create a custom Drupal PHP block, i.e., a Drupal block that is really a snippet of PHP code? (As opposed to plain HTML.)

One of the cool things about Drupal is that you can create and use blocks so easily, including custom Drupal PHP blocks. I use custom Drupal blocks for all sorts of things on my Drupal websites, including rotating Drupal block content, as I'll show in this example.

Drupal Console project

After being away from Drupal work for a long time, I just got back into it, and right away ran into a problem with Drupal 8 where, after migrating a Drupal 6 site to Drupal 8, I was unable to log into the new Drupal 8 website. I have no idea what the migration process set my user password to, but it wasn’t any of the ones I used on the old Drupal 6 website or on the new Drupal 8 website — probably because the migration process zapped my Drupal User 1 account.

Long story short, instead of using drush, I decided to use the Drupal Console project to reset the password, and it worked as advertised. After installing the Console project, just type drupal list | grep password to see the command to reset the password, and then use it. At the time of this writing the command is drupal user:password:reset. I have no idea if that will change in the future, but for now you can type that command and then respond to the prompts. You’ll need the User ID for the account that you want to modify, and you can get that by looking at the Drupal 8 users and users_field_data tables.

What is my Drupal user login URL?

Drupal user login URL FAQ: What the heck is my Drupal user login URL?

A funny story about this Drupal website (alvinalexander.com) is that after I first installed it with my own custom theme where I don’t display the Drupal login link, I couldn’t remember where the Drupal user login page was located. With my Drupal theme changes I didn’t have a link to the Drupal login page anywhere on my Drupal website pages.

After a little bit of poking around, I finally realized the Drupal login page is located at this pretty obvious URI:

How to disable Drupal 8 Twig debugging

Twig debugging in Drupal 8 is great — really great — when you need it as you’re developing a new Drupal 8 theme. But when you don’t need it, it generates a lot of extra output in your HTML that gets in the way of working on your theme development.

So, as a quick note to self, to disable (turn off) Drupal 8 Twig debugging, follow these steps:

New version of this website

If you’re reading this, that means the DNS change for alvinalexander.com has propagated to your location. I just moved this website to a new server and the latest version of Drupal on June 18, 2016. If anything is wrong with it, well, that’s gonna be my fault. I’ll fix broken things as fast as I can. :)

Drupal - Jump for joy, or off the balcony

Drupal alternatively makes me want to either jump for joy or jump off the balcony. Today was a balcony day.

Today’s issue is related to the handling of “tags” in Drupal 8, specifically the issue where you can’t add a new tag when editing a blog post, you can only reference existing tags. I have a degree in aerospace engineering, founded and sold a programming business, and can write software in many different languages, but a few things like this in Drupal make me feel like I need more of an education.

Drupal 8 Twig template "if string is not in array" solution

As a quick note, if you need a Drupal 8 Twig template if/else/then structure where you test to see if a string value is in an array, code like this will work:

{% if node.getType not in ['photo', 'text']  %}
    <div class="similar">
        {{ similar_by_terms }}
    </div>
{% endif %}

That code can be read as, “If the node type is NOT ‘photo’ or ‘text,’ emit the HTML/Twig code shown.”