I want to add two columns on one slide on the full width slider on the Divi theme in wordpress but I don't found how to add it,
I need an image on the left and text on the right as shown on the below image
That's actually built-in functionality. You just need to add the image and and it will automatically place it like your screenshot. If you want it on the right there is a dropdown for that as well.
Related
I am creating a Beaver Builder Wordpress site and cannot figure out how to make a row's background image semi-transparent. I have the Theme Customize -> Content settings to a background color - no issues.
In specific row modules (i.e. containing only a text box) I'd like to add an image to the row background, but then make that image 20% opaque. I know that in CSS this should be possible, but as a new page builder I don't know WHERE to add this code. It seems like if I add an opacity=20% code to the Customize -> Additional CSS would it not apply to the entire site?
If anyone could lead me to the right place and the specific code to add I'd be most appreciative.
Thanks.
For Wordpress, how can I make it like https://store.google.com/us/category/connected_home
Hotspot info, Top-tab for changing the spot. Can be made with slide revolution?
Inspect the page. They've positioned the elements with percentage based left and top values.
If I was to build something like this, I'd use javascript to hide and show the various labels when I click the menu tabs. And I'd add CSS animations so they transition in like in your example.
I am creating a slider like using revolution slider
I tried to add text under these images
1) Select text html from layer
but it's always-on the background image. I want Text under image? How can I do that?
Similarly, I have set maximum visible item 7 from carousal settings and space -250, but now only 3 items visible
Please help me
You can use custom css class for test and add z indexes for text to take it on the image
I have a screenshot below which I have to replicate in Wordpress. I am using Wordpress Divi theme.
1st Image:
2nd Image:
Problem Statement:
I am wondering which option I should select in the New Module section of wordpress (2nd Image) so that I am successfully able to align images in a single line (1st image).
Obviously, you have to choose the Image module to insert an image. Insert each image in a separate Image module.
But before that, make sure you have inserted a row and all of these modules are inserted into that particular row.
Two primary options come to mind:
You can create a single image as a composite of the 7 images (logos) you show in your first example image. A potential disadvantage of this is the sizing and spacing will be fixed. Although, that could also be to your advantage, since the whole composite image can resize somewhat responsively, it might work just fine.
If you want to have 2 or more images in a Column stacked horizontally (as opposed to the default vertical stacking), you can add the following Custom CSS to the page (go to Page settings in Divi Builder; then the Advanced tab, then Custom CSS) on the Row into which you've put the images (seven of them, in your example).
.imageStack .et_pb_image {
display: inline-block;
vertical-align: top;
}
Shown here:
On the Row in which you want the images to stack horizontally, go to Advanced tab, then the CSS ID / Classes, and put in the class imageStack.
Shown here:
As for your second image ... it sounds like you didn't know you need to use the Image module. In your case, with method #2 above, you'll be using 7 image modules. The trick is then getting them to not stack vertically. Using method #2 above will achieve that.
So i having problem to customise in bottom tabs the middle, i want to make middle tab height bigger then other tabs, so i cant find the way to customise it. It would be nice if there would be somebody that can help with this.
Link for editing link. And wanted result image.
Tried separately change the hight but, there are a feeling that flex box doesn't allow to tab go out of content.
Inherit the CSS class that holds the icon in the middle and add your custom properties.