django-cms plugin edit css background image 'placeholder_attr' is not a valid tag library error

Question

i have istalled djangocms-css-background 1.0.3, run migrations and included djangocms-css-background in settings.py

in my template, i have the code below.

{% load placeholder_attr %}

<div style="{% placeholder_attr 'My Background Css Placeholder' 'CssBackground' 'css_background' %}">
  {% placeholder 'My Background Css Placeholder' %}
</div>

Everytime i run the server, i encounter rhe error 'placeholder_attr' is not a valid tag library: Template library placeholder_attr not found

Kindly help.

Answer 1

djangocms-css-background depends on djangocms-placeholder-attr which has been deprecated Use cmsplugin-css-background instead.

1. Add the DOM element you'll be using:

       <div id="hero"></div>
    

2. Add the background image placeholder. css_selector should point to the DOM element you're targeting.

    {% with css_selector='#hero' %}
        {% placeholder 'element_background_image' %}
    {% endwith %}

3. Limit the plugins of element_background_image placeholder to CssBackgroundPlugin

    CMS_PLACEHOLDER_CONF = {
        'element_background_image': {
            'plugins': ['CssBackgroundPlugin'],
            'limits': {
                'global': 1,
            },
        },
    }

The FilerCssBackgroundPlugin is enabled if filer is installed.
The plugin will print out the applicable background-image css in the placeholder