I'm working with the Voicer theme, in the equipment page. It's a very nice layout and I would like to keep it as it is, but I need to add a few more items (devices). It originally it comes with 5 items and I need to add four more.
I noticed those images are coming from an images directory in the voicer theme folder, via shortcodes (block-bg-vc-eq-1), but there are only five of those. One for each item. I re-arrange the page, added four more rows and four more shortcodes (from 6 to 9) and the layout was fine but shows no images. See picture here.
Also, I tried to change the images directly from the page, placing custom images as background (at edit column setting), with the same dimensions like the originals, and at the end it leaves a space below and I can see the original image. See picture here. Same result adding it in the row as a single image.
Then just write the detected CSS in Customize-> Additional CSS or by using child theme. So, you will not lose it after the new package of our theme uploading.
Hello,
I'm working with the Voicer theme, in the equipment page. It's a very nice layout and I would like to keep it as it is, but I need to add a few more items (devices). It originally it comes with 5 items and I need to add four more.
I noticed those images are coming from an images directory in the voicer theme folder, via shortcodes (block-bg-vc-eq-1), but there are only five of those. One for each item. I re-arrange the page, added four more rows and four more shortcodes (from 6 to 9) and the layout was fine but shows no images. See picture here.
Also, I tried to change the images directly from the page, placing custom images as background (at edit column setting), with the same dimensions like the originals, and at the end it leaves a space below and I can see the original image. See picture here. Same result adding it in the row as a single image.
What should I do to achieve this?
Thanks in advance...
Carlos A.
Hello,Carlos A.
Yes, blocks backgrounds are added via CSS - https://prnt.sc/ui2657 and https://prnt.sc/ui26j2
So, to add own background you should write the next CSS, for example,
.block-bg-vc-eq-x {
background-image: url(../images/content/your_image_x.jpg);
background-repeat: no-repeat;
}
P.S. To find the desired CSS you should work with browser console ( f12 ) in your theme.
https://atendesigngroup.com/blog/how-determine-which-css-styling-element
Then just write the detected CSS in Customize-> Additional CSS or by using child theme. So, you will not lose it after the new package of our theme uploading.
P.S. also maybe it would be useful to read such recommendations - https://voicer.softali.net/wordpress/voicer/docs/#theme_pages, item 3
thanks!
Hello Olga,
Thanks for your quick answer.
Excellent! Problem solved.
Yes. I always work with the web inspector to check things, and with child themes too.
Thanks anyway for the suggestions.
Be well...
Carlos A.
glad to help you Carlos )
P.S. could you be so kind to rate our theme if you like it?)
thanks!