1. PROMO Upgrade to Pro Membership @ $99 / Lifetime & access all our 16+ premium Divi extensions: Divi Block, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved alternating text / image in two column row - phone view

Discussion in 'Free Divi Community Forum' started by Philip Dunne, Jan 9, 2023.

  1. Philip Dunne

    Philip Dunne New Member

    Hi,
    I have built a web page getting started - Startup IOM which has several 2 block rows with one block an image and the other a text block. I alternate the order of the image/text on each row, so row 1 has image then text, row 2 has text then image.
    That all looks fine in the desktop view but when I move to phone view I'd like the text and image to alternate in the vertical orientation. Obviously that doesn't happen currently as the phone view shows, the left most module first with the right module below it.
    Is there anyway that this can be avoided?
    Many thanks in advance
    Phil
     
    #1 Philip Dunne, Jan 9, 2023
    1. PRO MEMBER PERKS Divi Block Pro - Premade rolling text design for your Divi site without using any plugins:View Demo
  2. Problemizer.com

    Problemizer.com Divi Expert

    Hello Philip,

    This code should work to get what you want.
    Code:
    Log In or Sign Up to view this code.
    Please note that you have some inconsistencies in the desktop version regarding the order of alternation. For example this.
    upload_2023-1-9_13-53-53.png
    When you fix that everything will be sorted in the mobile version too.
     
    #2 Problemizer.com, Jan 9, 2023
    Philip Dunne likes this.
  3. Philip Dunne

    Philip Dunne New Member

    That's huge!
    Thanks so much. Works straight out of the box. The paragraphs at the foot of the page are going to be deleted shortly!
    BTW i) how did you identify the page ID? ii) I have several pages where I need to do this (e.g. page 789) , a) can I categorise them as a type and then select on the basis of that type b) if not do I need to write a similar code snippet for each page?

    Many thanks again
    Phil
     
    #3 Philip Dunne, Jan 9, 2023
    1. PRO MEMBER PERKS Divi Block Pro - Powerful Divi header builder for you to mix & match premade header design, mobile menu & more:Learn More
  4. Problemizer.com

    Problemizer.com Divi Expert

    Glad that it works for you!

    You can identify the page id by inspecting elements on the page you are working on. Just right-click and go "Inspect", or "Inspect elements" and you will see something like this.
    upload_2023-1-9_14-37-10.png

    WordPress automatically assigned page id as a class to the body tag.

    As far as the core is concerned you can add multiple classes like the following.
    Code:
    Log In or Sign Up to view this code.
    Let me know if this works for you.
     
    #4 Problemizer.com, Jan 9, 2023
  5. Philip Dunne

    Philip Dunne New Member

    Absolutely brilliant!!
    Thanks so much.
     
    #5 Philip Dunne, Jan 9, 2023
    Problemizer.com likes this.
    1. PRO MEMBER PERKS Divi Mini Cart Pro Plugin - Instantly add 3 different types of mini cart to your Divi site:Learn More
(You must log in or sign up to post here.)