1. SP Page Builder 3.x
  2. Wednesday, 01 July 2020
Hello! Please help me solve the problem. When I updated the component, the visual editor stopped displaying headers. It became very inconvenient to work. I tried reinstalling the component and disabling modules. The problem is not solved. Everything is displayed normally on the site.
Attachments (1)
Responses (7)
Hi,
Please clear your Joomla and Browser cache and then check
-Best Regards
Mehtaz
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 1
Thanks for the answer. But that was the first thing I did. The problem was probably in the section template. This problem was not noticed on other templates. You can view the section template if you want.

https://dropmefiles.com/NLGI2
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 2
could you please mention which template you are using?
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 3
I use the Ultimate Helix. After working with each block of this section template I found out that the problem is located in the block where the group of images is located. If this block is deleted, the headers appear in the visual editor. The reason is still unclear.
Attachments (1)
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 4
Create a test page, add an image addon and try to select your image in it. Will this work?
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 5
The problem was that the section template in the image addon had styles in the Custom CSS field that allowed displaying the title when hovering over the image. So there was some sort of CSS conflict. It would be great if you implemented this feature in future versions without using Custom CSS.

Styles in the Custom CSS in the image addon:

.sppb-addon-single-image{
position: relative;
}
.sppb-addon-single-image:after {
content: "";
background: rgba(0, 0, 0, 0.8);
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
transition: .3s;
opacity: 0;
}
.sppb-addon-title{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin: 0;
margin-top: -20px !important;
right: 50%;
width: 100%;
z-index: 10;
transition: .3s;
opacity: 0;
}
#addonId:hover .sppb-addon-single-image:after{
opacity: 1;
}
#addonId:hover .sppb-addon-title{
opacity: 1;
}
#addonId:hover .sppb-addon-image-overlay-icon{
z-index: 10;
display: block;
animation: zoomIn .5s;
background: #fff;
color: #000;
margin-top: 0px;
}
Attachments (1)
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 6
Совет. Не вставляйте никогда код в css поле аддона.
a) Потому что это может вызывать подобные конфликты в фронтенде
б) Потому что весь код помещенный туда попадает прямо на страницу, причем не валидным образом
в) Разместив 8 аддонов, содержащих код, вы разместили 8 раз этот одинаковый код внутри страницы, вместо того что бы использовать его всего один раз.

Используйте файл custom.css для всего вашего css кода.
Поле CSS внутри аддона удобно для быстрой примерки кода. Написали, проверили, если все нормально - переносите в custom.css. В аддоне просто используйте поле класса.

Tip. Never insert code in the css field of the addon.
a) Because it can cause similar conflicts in the frontend
b) Because all the code placed there goes directly to the page, and not in a valid way
c) Having placed 8 add-ons containing the code, you placed 8 times this same code inside the page, instead of using it only once.

Use custom.css file for all your css code.
The CSS field inside the addon is convenient for quick code fitting. Wrote, checked, if everything is fine - transfer to custom.css. In the addon, just use the class field.
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 7


There are no replies made for this post yet.
Be one of the first to reply to this post!


This forum is archived

This forum has been archived. Please use JoomShaper official support system.