Full width image in separated row on wordpress (Ref attacted) - wordpress

He everyone,
simple question for everone.
I am trying to build this style but i am very new in WordPress and cant figure it out myself.
See the link below:
https://blind.com/what-we-do/
I like the part "Strategy, Branding, Digital, Motion" with the test one side and image the other side.
I would like to recreate this exact style with the Responsiveness included.
Thank you for your help.
Alexandre

Since you've mentioned that you're using Siteorigin's page builder, I've decided to do a short video of how I would arrange the elements on the builder to achieve the results you're after.
here's my screencast: http://somup.com/cFit60VLyy
Now there are few flaws with siteorigin's pagebuilder - there is no inbuilt column equalizer for rows unlike other page builders like WPbakery and elementor. So you will have to use a plugin or write your own CSS. If you want to go the plugin way, install the Equal height columns plugin
And then you can add a class to any column you want to have equal width on left and right. You can see in my video that I've used the "equal" class under the attributes of the cells.
Depending on the theme you're using, you might need to write some CSS for margins and paddings. I'm sure its quite straight forward. You can do this in 10 mins straight.
Good luck.

Related

Where + how to edit Wordpress CSS to create a dropdown scrollable submenu in Wordpress?

I am a writer and I have menu for my chapters list on my website of 30+ chapters and currently it annoyingly looks like this:
current website
As you can see it cuts off, and Wordpress annoyingly doesn't have a feature that turns it automatically scrollable. There are 30+ chapters and you have to keep scrolling, scrolling, scrolling down to see them all.
I have found some good looking solutions on StackOverflow but don't know where and how to apply them on Wordpress.
If anyone could talk me through literally step-by-step 1. where to find the CSS of my Wordpress site 2. the code I'll need 3. where to paste it 4. if there's anything I need to add to the navigation block's inidividual "Additional CSS Classes" part like so: Additional box in the corner and anything else I need to do. I would be super grateful!
One of my fears is just dumping a bit of code somewhere in the middle of editable CSS and screwing up my entire site! My CSS knowledge is super beginner so laymans terms is very much appreciated thanks :)
I tried using Plugins (those seem even more confusing than CSS) and have considered using Elementor too but I have Googled and YouTubed, trying to find a solution and nowhere has something as specific as what I'm looking to achieve frustratingly.
I tried following this youtube video: https://www.youtube.com/watch?v=73XjO7hFZaw but didn't know what my "Target Element Selector" was, even when I went into Inspect on Chrome, all I found was this

Avada Live Builder Display doesn't match actual site

I'm trying to make the main menu of the site be on one row, but it wraps to a second row, even though I set No Wrap. In the Live Builder, it shows it working exactly how I want it to:
The live site malfunctions in the way described above:
How should I go about fixing this? What other information do you need?
I figured it out. Just had to change the site width so the menu fit in the whole view.

Customizing product slider, WooCommerce

Iam somewhat of a newbie when it comes to wordpress. so bear with me.
ive been trying to make a simple slider that will display 3 catagories.
- books
- Boardgames
- office supplies
iam making it for someone who dosnt want a web store but just wanting it to display items in a meaningfull and dynamik way.
what ive tried is installing the WooCommerce plugin to make all my products and then installing the product slider by pickplugins.
I like the way it looks and i want to make two more. but i see no option to choose between different catagories in the slider options, so if i make 2 more sliders it will just display the same items (all of them).
the site is: http://nordborgboghandel.dk/
and the slider i want is something like there is on the frontpage.
anybody fixed a similar problem??
-Thanks!
Yes, I was once stuck into a same situation, in which we had to customize the slider. Basically you will have to play with the CSS and JS of the slider plugin which you have used to create the slider.
You can start of by having a look at the js and the css used by the slider. Refer the documentation of the slider if available, I am sure if they have any documentation you can have it customized easily by modifying some values in it. If not then you will have to check the JS code and try to hack it yourself to fit your needs.

Put logo and custom graphic in top header on Divi Wordpress theme

Is it possible to put logo and a custom graphic in the "top-header" (ie. To the left of the phone number) in the popular ElegentThemes Divi template.
http://www.elegantthemes.com/demo/?theme=Divi
I have tried using absolute positioning and setting the container/body to relative. The code can be accessed by inpect-element.
To answer your question: yes, it is possible. Changing the structure (i.e. the HTML) of a theme, however, is not recommended for many reasons: you may break other parts of the site and/or when you update the theme, any changes you made will be lost. Furthermore, looking at the theme with the link you provided, there is already a place for the logo.

How to make complete masonry box clickable - Wordpress

I have a site: http://weltreise.inomex.ch/
I have three columsn Monsonry. I'm trying to make the complete each box clickable to complete post. Currently, only read more takes me to complete article. Any idea how to do it?
Thanks
How are you running the loop that delivers content to the blocks (plugin, custom template, etc.)
You need to make sure the link tags are being placed around the entire block, not just the "read more" link.
Author won't change theme just for you. It is also bad practice to change php file code by yourself, because of all updates and stuff. I would suggest that you add custom javascript(jQuery) (it is dirty solution, but it should work). Also be careful. Even if you wrap masonry brick with anchor(a), you should remove links that are inside that brick -> you should change anchor(a) with something else (span).

Resources