I wanted to know how this design is done on wordpress - css

I was learning wordpress and I came to this site where find this
this image screen short is from a website
the screen short is from https://www.whitehatjr.com/ if you scrolled down that site you'll get that area
I was wondering if this block is a image, whenever you put your mouse over that title at the end of the the line it has a hove effect.
Is CSS applied over each section of that image or the entire thing can be created with wordpress?

This thing was created by applying css for each block. http://i.imgur.com/JIFfSFX.png . For creating something like this you need to create some custom solution for wp.

Related

How do I remove spacing at the bottom of my site

I am creating a website for our company.
I wanted the homepage to be like a simple landing page. Something similar to this site (https://www.agbaonline.com)
The challenge I am having is, the page has a white spacing at the bottom that just doesn't look nice at all. How do I get rid of this. I don't intend to put a footer in the page as I want it to be as straightforward as possible.
This is the link to the website, currently being worked on (https://www.mimshakspares.com/test) - we are using wordpress and the Gutenberg Block Builder.
Thank you for your assistance guys.
Please remove margin-bottom of this class .uagb-block-1d95c7fa.uagb-column__wrap

Direct link to an image inside a gallery

I have to edit a wordpress site right now. One of the task is to give thumbnails a direct link to point the image directly in the gallery instead of the gallery page.
I can change the link in the thumbnails but I cannot find out what is the link which goes inside the gallery directly to a specific image. And of course keep the paging capabilities after that.
Depends on the gallery being used, in most cases you link to the gallery index.

Custom classes for imags in drupal

My basic requirement is to display one picture on a page which on clicking, displays a colorbox slideshow of all the pictures in that content type.
https://www.drupal.org/node/1026112
This is the solution I got for it. To apply display:none css for the rest of the images. For that, I need different classes for the images. I'm unable to figure out how to do so.I got a few solutions such as adding a preprocess_image function but it doesn't seem to work. Can I get some help here?
We did this in past using the "Image sets" option provided with the Lightbox2 Drupal module. We had a client request to show one image and then open a slideshow on the same page of the images associated with that content in the CMS. This module say:
If you have a set of images that you would like to group together in a
lightbox, but only wish for one of these images to be visible on your page, you
can assign the "lightbox_hide_image" class to hide the additional images. For
example:
image #1
image #2
image #3
You can create a custom node template to render the images in the required format.
Hope this will help you!

WordPress - manage logo to left of menu bar

I'm a developer but I don't know wordpress well and I have just inherited a wordpress site. There's a missing logo image at the top left next to the menu bar:
I have the image file but I cannot find where that logo/image is configured inside WP. I have gone into the Menus section many times -- I find the menu items but I cannot find where that image is configured. So I need to know where/how to configure that, and also how to make the image size "fixed". By default, when the image was there (before I accidentally deleted it somehow), it stretches/expands when the user scrolls down.
My client is using the "Divi Builder" template, and this template uses some kind of custom layout/template for managing and editing the page.
The Divi theme is being used and here's what it looks like inside theme customization:
So in summary:
Where/how can I find that image setup so I can fix the src to point to the correct image that I have?
How can I prevent its default behavior of expanding while scrolling down?
Thanks!
For logo settings:
Goto dashboard->appearence->divi theme option->Generl settings.
other settings
Support Docs-> Read divi theme documention
The Divi theme is a commercial theme and don't expect people on SO to have access to it. It's best to go to https://www.elegantthemes.com/forum/ for support.
"Where/how can I find that image setup so I can fix the src to point to
the correct image that I have?"
The logo is uploaded and the URL set in theme options, not in the menu options.
"How can I prevent its default behavior of expanding while scrolling
down?"
This is a completely separate question and is a feature of the theme. Ask theme support how to disable it. Or isolate the Javascript and other code and put it in a Fiddle so people can see how it works.

WordPress Hero SlideShow Links

I'm fairly new to WordPress and I'm working on a site that was created by someone else; I've inherited the entire thing. There is a Hero Slideshow which works, but users have to click on the "tabs" then click on another image (Learn More) in order to go to the page they want; which of course is too much trouble.
I've found the code in front-page.php and I've changed how the spans and a href tags are in hopes of making the "tabs" in the Hero slideshow link directly to the associated pages. Everything looks correct and if you hover over the tabs the browser will show the correct link - however when you click on the tab it simply rotates the slideshow and doesn't actually link to the associated page. I can't find where I can change this behavior.
Anyone have any ideas?
stay well away from the php in wordpress .
just uninstall the hero slideshow and use "Cyclone Slider 2" plugin its very user friendly
easy to use , you can add and change pic and there is a lot of options on movement speeds enbed url links (etc)

Resources