WordPress.org

Forums

ABASE
[resolved] External Image URL (21 posts)

  1. TankMaster1970
    Member
    Posted 11 months ago #


  2. TankMaster1970
    Member
    Posted 11 months ago #

    Hello All,

    Production URL - http://www.tankmaster.com.au/wp/

    Issue URL - http://tankmaster.com.au/wp/?page_id=11

    I am new to WordPress but very keen to set up a few sites using it.

    I have multiple sites on a Linux VPS and quite a few of these sites connect to the same MySQL database).

    I have recently installed ABASE to assist in displaying data from another domain with no problems.

    I can display the table I want with no problems. I can also get an image field to appear. My problem is getting the image to get the right source (src).

    CODE (WITHOUT IMAGE) - WORKING

    [abase db="2" table="data_poly_round_tanks" center="*" columns="ProductID,Litres,Gallons,Diameter,WallHeight,TotalHeight,Price,Image" order="Litres"]

    This code displays correctly with the image field as plain text.

    CODE (WITH IMAGE) - WORKING

    [abase db="2" table="data_poly_round_tanks" center="*" columns="ProductID,Litres,Gallons,Diameter,WallHeight,TotalHeight,Price,Image" order="Litres" images="Image"]

    This displays the image but with the wrong URL so the image cannot be displayed properly.

    ATTEMPTED CODE - NOT WORKING - Displays as CODE (WITHOUT IMAGE) - WORKING)

    [abase db="2" table="data_poly_round_tanks" center="*" columns="ProductID,Litres,Gallons,Diameter,WallHeight,TotalHeight,Price,Image" order="Litres" images="Image::=(http://www.tankmasteraustralia.com.au/product-poly-round-tanks/^)Image"]

    This code reverts back to displaying the content of the field in plain text. No image displayed at all.

    I seem to be having a problem from immediately after the images="Image part.

    Any help on this issue would be a huge help.

  3. TankMaster1970
    Member
    Posted 11 months ago #

    Well having thunk about it for a bit and tweaking the code, I've managed to fix my own problem.

    ABASE - Great plugin but maybe the Attribute references could be a little clearer...!

    FIXED CODE

    [abase db="2" table="data_poly_round_tanks" center="*" columns="ProductID,Litres,Gallons,Diameter,WallHeight,TotalHeight,Price,Image" order="Litres" images="http://tankmasteraustralia.com.au/product-poly-round-tanks/^Image" style="width:50px" ]

  4. Randall2961
    Member
    Posted 8 months ago #

    Hi TankMaster1970

    Thanks - your last post was a massive help. I agree that the attribute references could be a little clearer, but I also agree that Abase is a fabulous plugin, so very well done Richard.

    I note that when you pasted your fixed code above, you did not include your Image column in the columns attribute (it ends with a ,). I had to include my equivalent column name in the columns attribute, and hey presto, it all worked.

    Thanks again and kind regards
    Randall

  5. TankMaster1970
    Member
    Posted 8 months ago #

    Thank you for the comment Randall2961.

    The fixed code was all there, I think you just needed to scroll across a bit.

    It was a copy and paste of the code that is working on my website page.

    Regards

    Dave (TankMaster1970)

  6. Randall2961
    Member
    Posted 8 months ago #

    Hi Dave

    Oops, sorry about that, you're right, it seems I was just too lazy to scroll :)

    Now I have to work on the layout of my database results, which looks like another challenge in itself.

    Kind Regards
    Randall

  7. TankMaster1970
    Member
    Posted 8 months ago #

    Hey Randell,

    As much as I love what ABASE can do, I have also struggled with the layout, especially with "responsive" layouts (going from desktops to smart phones/tablets.

    See http://www.tankmaster.com.au/wp/poly-round-tanks to see what I mean.

    Dave

    P.S. I used NextGEN gallery to get the lightbox popups for the images.

    You have to turn on a setting under "Other Options / Lightbox Effects" that says What must the lightbox be applied to? (Answer) Try to apply to all images that link to image files.

  8. Randall2961
    Member
    Posted 8 months ago #

    Thanks Dave

    I think you've put together a great website - very simple, very clean and very functional.

    I like what you've done with your images, so thanks also for the tip re NextGEN and lightbox popups. I think I'll be able to use that.

    So far I haven't even been able to change the font size of my database results, let alone alignment or anything else. I'll keep on that and I'm hoping I can do something with the notable="1" attribute, which leaves out the beginning and ending table tags and hopefully then gives some flexibility to add some style. I'll start a new post on that when I know more.

    Thanks again and kind regards
    Randall

  9. TankMaster1970
    Member
    Posted 8 months ago #

    Hey Randell,

    I think you'll find that the font size of your results is all just CSS.

    It should just be a case of setting the table, tr or td font-size: 12px or whatever size you need. I've found that sometimes you need to add !important to force the CSS to take effect. I'm not a full bottle on CSS but manage to struggle my way through on most things.

    I use a template called Vantage (Premium) on a few sites now. It allows you to put Custom CSS in quite easily and it's really easy to do a lot of thing to style your whole site including page structure. It's cheap too, starting from $5.00 US (no support) to whatever you are willing to pay..!

    I'm sure you already know but don't forget to make a Child Theme before you start editing CSS or other theme files.

    Cheers
    Dave

  10. Randall2961
    Member
    Posted 8 months ago #

    Thanks Dave

    I'll let you know how I go with the style in due course.

    Although I managed to successfully display a single image with your help, I still can't get it to work for multiple images. I would have thought the following shortcode would work, but although it displays the first image properly, it only displays the cell content for the second image:

    [abase table="table" fields=".....,Photo1,Photo2" images="<site_url>^Photo1,<site_url>^Photo2"]

    Did you ever manage to display more than 1 image in a table?

    Kind regards
    Randall

  11. TankMaster1970
    Member
    Posted 8 months ago #

    Hello Randall,

    You are going to kick yourself.... The more I use abase the easier it gets.

    It took me a few minutes to work out but it's a simple as a comma...!

    [abase db="2" table="data_poly_round_tanks" style="width:100%" center="*" columns="Product ID^ProductID!'width:100px;font-size:12pt',Litres^Litres,Gallons^Gallons,Diameter (mm)^Diameter,Wall Height (mm)^WallHeight,Total Height (mm)^TotalHeight,Price ($)^Price,Image^Image!width:50px;vertical-align:-25px;,Image 2^Image2!width:50px;vertical-align:-25px;" order="Litres" images="product-images/poly-round-tanks/^Image,Image2"]

    The code above is for this page - http://tankmaster.com.au/wp/poly-round-tanks-test (I'll leave this page live for a couple of days so you can check it out).

    Basically, add your columns as per normal. For the images to display using the images short code, try this:
    images="product-images/poly-round-tanks/^Image,Image2"

    This does only seem to work if the image files are located in the same directory (in my case).

    This code did NOT work. I don't think abase likes referencing two different locations:
    images="product-images/poly-round-tanks/^Image,product-images/poly-round-tanks/^Image2"

  12. TankMaster1970
    Member
    Posted 8 months ago #

    Just an update you might have picked up n from my last post, you can reference locations (for image files) without having to use the entire URL, just from the WordPress installation directory...!

  13. Randall2961
    Member
    Posted 8 months ago #

    Hi Dave

    You're a Legend! It's now working perfectly for multiple images, so thanks!

    I think I may have tried exactly that code, but made the mistake of only refreshing the search results page, which is on a different page to the actual search page. That's a trap for new players because the refresh wouldn't have activated the new code.

    I'm not having quite as much luck with formatting my table contents, other than adjusting the column titles. I used some of the exact code from the shortcode you posted, but it would not work for me. I inspected the element using Chrome and I think that the changes are being overridden by my parent or child style.css files. So hopefully I will be able to sort it out there.

    Thanks again for your help, much appreciated!

    Kind regards
    Randall

  14. Randall2961
    Member
    Posted 8 months ago #

    Hi again Dave

    I may have to retract that. Not the bit about you being a Legend, just the bit about why the image code didn't work for me before. The relevant code is in the search results page, so refreshing probably should have worked if I got the code right. As you say, I must have missed a comma here or stuck in an extra pointy hat there, or something like that. The main thing is it's working!

    Kind regards
    Randall

  15. TankMaster1970
    Member
    Posted 8 months ago #

    Thank you Randall,

    It's always nice to be appreciated. I'll give my wife a talking to about that later - ha ha ha.

    Something I picked up with CSS Styling, especially in WordPress, is that you sometimes need to add the "important" to force your styling.

    e.g.

    /* Lightbox Caption Modifications */
    #fancybox-title {
    font-size: 18px !important;
    }

    instead of

    /* Lightbox Caption Modifications */
    #fancybox-title {
    font-size: 18px;
    }

    This exact piece of styling stumped me for a few hours until I happened to look at some other styling using the "!important" addition.

    I'll post seperately on the abase code...

    Dave

  16. TankMaster1970
    Member
    Posted 8 months ago #

    I found it easier in some cases to break down the abase shortcode to make sure you have everything in the right place.

    So while you are contructing the abase short code:

    [abase db="2" table="data_poly_round_tanks" style="width:100%" center="*" columns="Product ID^ProductID!'width:100px;font-size:12pt',Litres^Litres,Gallons^Gallons,Diameter (mm)^Diameter,Wall Height (mm)^WallHeight,Total Height (mm)^TotalHeight,Price ($)^Price,Image^Image!width:50px;vertical-align:-25px;" order="Litres" images="product-images/poly-round-tanks/^Image"]

    I break it down as follows:

    [abase db="2"
    table="data_poly_round_tanks"
    style="width:100%"
    center="*"
    columns="
    Product ID^ProductID!'width:100px;font-size:12pt',
    Litres^Litres,
    Gallons^Gallons,
    Diameter (mm)^Diameter,
    Wall Height (mm)^WallHeight,
    Total Height (mm)^TotalHeight,
    Price ($)^Price,
    Image^Image!width:50px;vertical-align:-25px;
    "
    order="Litres"
    images="product-images/poly-round-tanks/^Image"
    ]

    I can then check to make sure I have all the table fields and field titles right as well as the other functions.

    You will of course have to remove all the line breaks and make sure there is a space between each function again after you have checked everthing (as per the first block of code in this post).

    Hope that helps.

    Dave

  17. Randall2961
    Member
    Posted 8 months ago #

    Thanks Dave

    I'm more than happy to report that the notable="1" attribute that Richard added to Abase a year or so ago is a big winner and basically facilitates pretty much any styling that you can think of. You add your own table tags before and after the Abase shortcode and at the same time create a new style class in your child theme style.css file. A few Google searches will turn up a tonne of css options and with a bit of trial and error you can style individual rows and columns any way you like, including font size, colour and alignment. If things aren't doing what you want them to do, it helps to use the "Inspect element" feature in Chrome to have a look at the table structure.

    I must say I'm really, really impressed with Abase and can feel a donation coming on when I've finished building my blog/website.

    All the best
    Randall

  18. TankMaster1970
    Member
    Posted 8 months ago #

    Hi Randall,

    Awesome stuff on the styling. Could you provide an example? I would love to see some styling options for the tables generated with Abase.

    Cheers

    Dave

  19. Randall2961
    Member
    Posted 8 months ago #

    Hi Dave

    I'm not quite ready to post a public link, but can I contact you through the Tankmaster website contact email or could you provide me with another email address?

    Kind regards
    Randall

  20. TankMaster1970
    Member
    Posted 8 months ago #

    No problem Randall,

    You can email me at sales@tankmaster.com.au, it comes to me.

    Cheers

    David

  21. TankMaster1970
    Member
    Posted 8 months ago #

    Just started doing a bit of work on styling form results using abase.

    We should probably start a new thread for this though...!

Reply

You must log in to post.

About this Plugin

  • ABASE
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic