Manipulate the head via Custom Theme #4239

New Issue

OVERLORD · 2026-02-05T08:19:27+03:00

OVERLORD commented

2026-02-05 08:19:27 +03:00

Originally created by @ikabod on GitHub (Sep 26, 2023).

Attempted Debugging

I have read the debugging page

Searched GitHub Issues

I have searched GitHub for the issue.

Describe the Scenario

Hi,

I want to add my own JavaScript and CSS to the head section via PHP.

Reason: I prefer to have all customization files under my custom theme folder. The current approach is, to read the content of my files from the folder "/themes/my-theme/js/" and create the file in "/themes/my-theme/common/custom-head.blade.php". Not yet programmed, but should work.

This seems to me an ugly solution - is there a way to achieve this via a theme event too?

Thanks,
Peter

Exact BookStack Version

BookStack v23.08.3

Log Content

No response

Hosting Environment

php 8.2.10 on localhost (Apache on Manjaro)

Originally created by @ikabod on GitHub (Sep 26, 2023). ### Attempted Debugging - [X] I have read the debugging page ### Searched GitHub Issues - [X] I have searched GitHub for the issue. ### Describe the Scenario Hi, I want to add my own JavaScript and CSS to the head section via PHP. Reason: I prefer to have all customization files under my custom theme folder. The current approach is, to read the content of my files from the folder "/themes/my-theme/js/" and create the file in "/themes/my-theme/common/custom-head.blade.php". Not yet programmed, but should work. This seems to me an ugly solution - is there a way to achieve this via a theme event too? Thanks, Peter ### Exact BookStack Version BookStack v23.08.3 ### Log Content _No response_ ### Hosting Environment php 8.2.10 on localhost (Apache on Manjaro)

OVERLORD added the 🐕 Support label 2026-02-05 08:19:27 +03:00

OVERLORD closed this issue

2026-02-05 08:19:33 +03:00

OVERLORD commented

2026-02-05 08:19:37 +03:00

@ssddanbrown commented on GitHub (Sep 26, 2023):

This seems to me an ugly solution - is there a way to achieve this via a theme event too?

There is no specific custom theme event for this, since this is something already well covered by the visual theme system.
As there a reason you feel this is an ugly solution?

@ssddanbrown commented on GitHub (Sep 26, 2023): > This seems to me an ugly solution - is there a way to achieve this via a theme event too? There is no specific custom theme event for this, since this is something already well covered by the visual theme system. As there a reason you feel this is an ugly solution?

OVERLORD commented

2026-02-05 08:19:42 +03:00

@ikabod commented on GitHub (Sep 26, 2023):

Is it possible to set the setting "app-custom-head" in the APP_BOOT event? If yes, can you pleas provide an example how to access the setting via PHP?

@ikabod commented on GitHub (Sep 26, 2023): Is it possible to set the setting "app-custom-head" in the APP_BOOT event? If yes, can you pleas provide an example how to access the setting via PHP?

OVERLORD commented

2026-02-05 08:19:48 +03:00

@ssddanbrown commented on GitHub (Sep 26, 2023):

@ikabod

You could do something like this:

<?php

use BookStack\Facades\Theme;
use BookStack\Theming\ThemeEvents;

Theme::listen(ThemeEvents::APP_BOOT, function () {
    setting()->put('app-custom-head', '<style>body{background: tomato;}</style>');
});

but I wouldn't advise it. I'd say it's much more elegant to add styles via the visual theme system.

@ssddanbrown commented on GitHub (Sep 26, 2023): @ikabod You could do something like this: ```php <?php use BookStack\Facades\Theme; use BookStack\Theming\ThemeEvents; Theme::listen(ThemeEvents::APP_BOOT, function () { setting()->put('app-custom-head', '<style>body{background: tomato;}</style>'); }); ``` but I wouldn't advise it. I'd say it's much more elegant to add styles via the visual theme system.

OVERLORD commented

2026-02-05 08:19:52 +03:00

@ikabod commented on GitHub (Sep 27, 2023):

Thanks, that works fine.

I do not know where to put CSS in the visual theme? The docs says only how to override views?

@ikabod commented on GitHub (Sep 27, 2023): Thanks, that works fine. I do not know where to put CSS in the visual theme? The docs says only how to override views?

OVERLORD commented

2026-02-05 08:19:55 +03:00

@Man-in-Black commented on GitHub (Sep 27, 2023):

You can just create an own CSS within in the WebGUI under settings -> personalisation.
Then you can use this class as usual with the "class" attribute.

@Man-in-Black commented on GitHub (Sep 27, 2023): You can just create an own CSS within in the WebGUI under settings -> personalisation. Then you can use this class as usual with the "class" attribute.

OVERLORD commented

2026-02-05 08:19:57 +03:00

@ssddanbrown commented on GitHub (Sep 27, 2023):

I do not know where to put CSS in the visual theme? The docs says only how to override views?

Yeah, so you can override any relevant view and add CSS.

Therefore you could override the custom head template, where custom styles added via the UI are used.

Or you could use this base-body-start.blade.php template that exists for customization. Gets used at the start of the body for pretty much every UI view.
Style tags in body are not technically correct but will probably work find in the vast majority of cases due to browser compatibility handling.

@ssddanbrown commented on GitHub (Sep 27, 2023): > I do not know where to put CSS in the visual theme? The docs says only how to override views? Yeah, so you can override any relevant view and add CSS. Therefore you could override [the custom head template](https://github.com/BookStackApp/BookStack/blob/d5a3bdb7aa7876f667256fb3e0d36ef46940adf9/resources/views/layouts/parts/custom-head.blade.php#L7), where custom styles added via the UI are used. Or you could use this [base-body-start.blade.php](https://github.com/BookStackApp/BookStack/blob/8d8da31fdd926aab7dc5084e62a96af447a9930a/resources/views/layouts/parts/base-body-start.blade.php) template that exists for customization. Gets used at the start of the body for pretty much every UI view. Style tags in body are not _technically correct_ but will probably work find in the vast majority of cases due to browser compatibility handling.

OVERLORD commented

2026-02-05 08:20:04 +03:00

@ikabod commented on GitHub (Sep 27, 2023):

Thank you for clarification.

I prefer to have all CSS code in a single file (or at least in the same folder).

Therefore I use the event method and write the needed JavaScript and CSS code via PHP into the settings.

Thanks again for taking time to this topic.

@ikabod commented on GitHub (Sep 27, 2023): Thank you for clarification. I prefer to have all CSS code in a single file (or at least in the same folder). Therefore I use the event method and write the needed JavaScript and CSS code via PHP into the settings. Thanks again for taking time to this topic.

OVERLORD commented

2026-02-05 08:20:09 +03:00

@ssddanbrown commented on GitHub (Sep 27, 2023):

Happy to help, will therefore close this off.

@ssddanbrown commented on GitHub (Sep 27, 2023): Happy to help, will therefore close this off.

OVERLORD referenced this issue

2026-02-05 10:29:27 +03:00

[PR #4239] [MERGED] Updated translations with latest Crowdin changes #6328

Sign in to join this conversation.

Branches Tags

development

l10n_development

release

v26-03

ci_fixing

codeberg-actions

lexical_may_2026

MilnerMart/development

sort_rule_text

GamerClassN7/impersonations-for-admin

Zhey-on/feature/csp-image-css-controls-6033

tortillas5/development

clauvaldez/mfaReset

llm_only

vectors

McTom234/oidc-key-algorithms

docker_env

drawio_rendering

user_permissions

ldap_host_failover

svg_image

prosemirror

captcha_example

fix/video-export

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/BookStack#4239