Okay
  Public Ticket #3567508
Adding inline image next to text in cells
Closed

Comments

  • Siew started the conversation

    I'm trying to build a table where the data in the cells have an image/icon next to the text for Manual table.

    You often see these tables in game media wiki sites. I've added pics as example.

    I know its possible to add inline image next to the text in Simple table but is it possible to do this in Manual table? I can't this anywhere in the documentation.

    Attached files:  eg2.JPG
      eg1.JPG

  •  1,689
    Miloš replied

    Hello,

    You can have images with text combined in the same cell of our Tables.

    It can be done differently depending on the Table Type you make,

    and depending if the Table is editable from our Plugin or not.

    -

    If you will be using an Editable Table, in a String Column type.

    You can  input HTML code in a cell, with a HTML image tag, along with text in the same cell, and it should work. 

    ( Or you can use our HTML editor, too)

     Here is an example of a cell like that in my Table :

    4339835720.png

    If you use HTML editor input type, make sure to select this "Source code", and then you will type HTML there:

    4913294920.png

     Then, create an image HTML tag, with the proper path to the image/icon that you need; 

    in my case, I just uploaded a simple image in the WP library and typed that path, 

    and after and/or before the image tag, you can put any text you need.

    8197282367.png

    - When I refreshed it, it automatically wrapped everything in a paragraph tag, as you can see; but you can just use <img> tag, and type text before/after; experiment with HTML code as you need.smile.png

    -

    Or, if you will use non-editable Tables, such as table linked from Google Sheet/CSV/ Excel and similar;

    Then in your source cells, you will have to create the HTML image tag with Image path URL,

    for example something like :

    <img src="yourImageURL.jpg"> your cell Text
    

    and add any text you need after ( or before) the image HTM img tag.

    Just make sure to use a String Column type in our Tables for this to work.

    Let me know if that helps and if you encounter any issue while trying this.

    Kind Regards, 

    Miloš Jovanović
    [email protected]

    Rate my support

    wpDataTables: FAQ | Facebook | Twitter | InstagramFront-end and back-end demo | Docs

    Amelia: FAQ | Facebook | Twitter | InstagramAmelia demo sites | Docs | Discord Community

    You can try wpDataTables add-ons before purchasing on these sandbox sites:

    Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables