django-cms / djangocms-bootstrap4

django CMS Bootstrap 4 is a plugin bundle for django CMS providing several components from the popular Bootstrap 4 framework.
https://www.django-cms.org/
Other
82 stars 58 forks source link

Icons aren't rendered / API mismatch with djangocms-icon #124

Open Xiphoseer opened 3 years ago

Xiphoseer commented 3 years ago

As explained in https://github.com/django-cms/djangocms-bootstrap4/issues/101#issuecomment-626652162, the Bootstrap4LinkPlugin currently uses djangocms_icon Icon fields for left_icon and right_icon. These are special CharFields, so the following part in the link/default/link.html template sets instance to a string:

{% with icon_class=instance.icon_left instance=instance.icon_left %}
    {% include "djangocms_icon/includes/icon.html" %}
{% endwith %}

This is not consistent with the implementation of djangocms_icon, specifically the includes/icon.html template, which expects, instance to be an instance of the Icon model. As strings have neither an icon field nor an attributes field, nothing is actually rendered and the icon is missing on the site.

Is this a holdover from some old version? Are the two plugins not supposed to be compatible at their respective latest versions? Was this plugin simply not updated (yet)? What is the intended behavior?

Should Bootstrap4Link switch to a foreign key or change the template to just use the css class string from the Icon field? If you want, I can send a PR that's effectively the solution from the comment on the other issue mentioned above.

crydotsnake commented 3 years ago

Is the issue still current, or can the issue be closed?

rastytheamateur commented 2 years ago

It seems to be still current with no fix.

svandeneertwegh commented 2 years ago

Problem is still. When i choose icon left and/or icon-right when using bootstrap-link plugin and save plugin. It renders the link and all of it options except no icon: <i area-hidden="true"></i> This missed the fontawesome classes.

fsbraun commented 2 years ago

A work around would be to provide your own includes/icon.html template, e.g.,

<i class="{{ icon_class }}"></i>

You might want to think about adding some spacing to avoid the icon being right next to your link text.

svandeneertwegh commented 2 years ago

@fsbraun But now you'l break icon plugin. With an if else it is solved. {% if icon_class %}{{ icon_class }}{% else %}{{instance.icon }} {% endif %}

fsbraun commented 2 years ago

I've taken the above approach in djangocms-frontend (https://github.com/fsbraun/djangocms-frontend) which supports Bootstrap 5. :smile:

i-salameh95 commented 1 year ago

should this workaround fix that the icon not appear when use with link inside django_ckeditor ?