MP4-video hover/mouse-over effect instead of image for portfolio item in WordPress

Posted 3 years ago
Worldwide

We are using the Quart template from Qode Interactive: https://quart.qodeinteractive.com/
Our homepage is like this: https://quart.qodeinteractive.com/portfolio/carousel-slider/

I have uploaded the website for you convenience to www.justserving.nl/ma (homepage).

On our home page (www.justserving.nl/ma), you can see the Carousel Slider with several (video) portfolio items. Each item consists of a thumbnail image and a hover/mouse-over (GIF) image. As you may notice, when hovering on an item, the GIF image is shown/played instead of the thumbnail image, but it’s not clear and quite pixelated. Therefore, for each portfolio item, we want to be able to select/configure an MP4 video (uploaded to the Media Library) instead of GIFs or JPGs for the hovering effect.

When you want to edit a Portfolio item of the Carousel Slider, you need to go to the "Edit Portfolio Item" page of that portfolio item (in wp-admin) as follows:
- Log into wp-admin;
- Go to the homepage (www.justserving.nl/ma);
- Click on a portfolio item (the portfolio item page opens);
- Once the page is loaded, click on "Edit Portfolio Item" in the upper black bar.

In the "Edit Portfolio Item" page, the thumbnail image is configurable in the bottom section of the right panel area called "Featured Image". The functionality of that part is fine. In the main area of that same page, under the section "Mikado Portfolio Settings" (in the part that is also called "Featured Image"), the hover/mouse-over effect is also configurable, but as explained it does not support the selection of MP4 files as hover/mouse-over type – only JPG or GIF. Therefore, we want to customize that part in order to allow us to show selected uploaded MP4 files in the Media Library as "Featured Image" for the hover effect and to play these videos in the Carousel Slider on the homepage on hover/mouse-over events.

Let me know how you want access to the website in order to work on it.

I can upload for you:
- The complete website packaged using WP plugin "Duplicator" (https://wordpress.org/plugins/duplicator/). It consists of an installer.php and a ZIP file. It is easy to use if you know how to use/restore Duplicator packages.
- Otherwise, the complete website packaged as just WP-files/folders and database separately.

Attached you will find:
- "Edit-Portfolio-Item-WordPress.pdf": a screen-capture of the "Edit Portfolio Item" page where I show you where to find both "Featured Image" sections (one for the thumbnail and the other for the hover effect).

Thanks.

  • Less than 30 hrs/week
    Hourly
  • < 1 month
    Duration
  • Intermediate
    Experience Level
  • Remote Job
  • One-time project
    Project Type
Skills and Expertise
Programming Languages
PHP JavaScript HTML CSS 3
+ 1 more
Website Builders & CMS Platforms
WordPress
Other
MySQL
Activity on this job
  • Proposals:
    Less than 5
  • Last viewed by client:
    2 years ago
  • Hires:
    1
  • Interviewing:
    4
  • Invites sent:
    13
  • Unanswered invites:
    9
About the client
Member since Feb 9, 2021
  • Netherlands
    Rotterdam 9:50 PM
  • $602 total spent
    5 hires, 1 active
  • 33 hours
  • Mid-sized company (10-99 people)

Explore similar jobs on Upwork

Need WordPress Developer in Dhaka
New
Hourly ‐ Posted 46 minutes ago
Theme Development WordPress PHP JavaScript MySQL Gutenberg Editor
Transferring a site to WordPress from WebArchive (16k pages)
New
Fixed-price ‐ Posted 54 minutes ago
WordPress Web Development HTML CSS

How it works

  • Post a job icon
    Create your free profile
    Highlight your skills and experience, show your portfolio, and set your ideal pay rate.
  • Talent comes to you icon
    Work the way you want
    Apply for jobs, create easy-to-by projects, or access exclusive opportunities that come to you.
  • Payment simplified icon
    Get paid securely
    From contract to payment, we help you work safely and get paid securely.
Want to get started? Create a profile

About Upwork

  • Rating is 4.9 out of 5.
    4.9/5
    (Average rating of clients by professionals)
  • G2 2021
    #1 freelance platform
  • 49,000+
    Signed contract every week
  • $2.3B
    Freelancers earned on Upwork in 2020

Find the best freelance jobs

Growing your career is as easy as creating a free profile and finding work like this that fits your skills.

Trusted by

  • Microsoft Logo
  • Airbnb Logo
  • Bissell Logo
  • GoDaddy Logo