Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    Can I put images within the Text Area?

    General Discussion
    text text editor images area image
    3
    6
    1138
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • 9
      90s last edited by

      I would like to do something like this —> www.hansbroek.com <— and put images between words.
      Can you help me? :)

      I'm quite new to the web site coding world, so I'll be very grateful if you'll explain all the steps to do it.
      Thanks you so much!

      PS: i know that a similar topic already exists, but it didn't help me :(

      1 Reply Last reply Reply Quote 0
      • arminunruh
        arminunruh Global Moderator last edited by

        Oh, hmmm, thats not super easy to do

        Create a new text, just write "Hey".
        Give the textfield a class "test-img-wrap" using the "class" button (here's where to find the class button: http://laytheme.com/documentation.html#custom-css-styling )

        Screen Shot 2016-05-02 at 10.57.56.png

        Now edit the text and put text and images into a textfield using the <> code button. I'm using the class "img-in-text" for every image

        <p>Hello</p><img class="img-in-text" src="https://upload.wikimedia.org/wikipedia/en/d/d4/Mickey_Mouse.png" /><p>Hello</p><img class="img-in-text" src="https://upload.wikimedia.org/wikipedia/en/d/d4/Mickey_Mouse.png" /><p>Hello</p><img class="img-in-text" src="https://upload.wikimedia.org/wikipedia/en/d/d4/Mickey_Mouse.png" /><p>Hello</p><img class="img-in-text" src="https://upload.wikimedia.org/wikipedia/en/d/d4/Mickey_Mouse.png" />
        

        Screen Shot 2016-05-02 at 10.58.12.png

        Now put some CSS into "lay-options" -> "custom css":

        .col img.img-in-text{
            display: inline-block;
            height: 100px;
            width: auto;
            position: relative;
        }
        
        .test-img-wrap p{
            display: inline-block;
            vertical-align: middle;
        }
        

        And thats what it looks like:
        Screen Shot 2016-05-02 at 11.08.42.png

        1 Reply Last reply Reply Quote 0
        • S
          samuel_gadea last edited by

          Hello !
          Thank's for this tutorial.
          I have a question.
          Is it possible to use the lightbox plugin with img in the text ?
          I can not make it work.

          (sorry for my bad english)

          Samuel

          1 Reply Last reply Reply Quote 0
          • arminunruh
            arminunruh Global Moderator last edited by

            Hey Samuel, your english is great, don't worry. Unfortunately the lightbox works only with images that you add using the '+image' button.

            1 Reply Last reply Reply Quote 0
            • S
              samuel_gadea last edited by

              Hey !
              I managed to use lightbox plugin in the text after few hours of work. I've fiddling "app-min.js" and the plugin is almost OK. You can see the result on youtube. The website is not currently online.
              Thanks anyway for your answer.

              Samuel

              co.jpg

              1 Reply Last reply Reply Quote 0
              • arminunruh
                arminunruh Global Moderator last edited by

                Oh wow great job!

                1 Reply Last reply Reply Quote 0
                • First post
                  Last post
                Post a link to where the problem is if possible, please <3
                I don't answer or check forum DMs, please just post on the forum.
                Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com

                Before you post:

                Use the Search Feature. Maybe there is already a solution to your issue.

                1. Update Lay Theme and all Lay Theme Addons
                2. Disable all Plugins
                3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
                4. When using a WordPress Cache plugin, disable it or clear your cache. Now see if your problem solved itself.
                Go here, see if your problem is listed here:
                Troubleshooting

                When you post:
                1. Post a link to where the problem is
                2. If the problem is difficult to explain, post screenshots / link to a video to explain it

                Thanks!

                Online Users

                Recent Topics

                • Search as icon instead of text?

                • FILTER Categories showing all projects

                • H

                  Vimeo embed with autoplay and loop is really slow...help!

                • A

                  website not loading on iphone safari

                laytheme.com