Home>Support>Correct Image size For MetaSlider

Correct Image size For MetaSlider

Hi. I’ve tried everything to make my image show in their entirety (the whole image and not just a portion of it). I’ve contacted Matcha Labs and they offered suggestions and I’ve even tried adding the shortcode to the custom css page under appearance per the Site Origin suggestion. i also resized the images to 1080 x 420 to make them all uniform. I still cannot get it to work.
I am wondering if it has something to do with the image size, but in getting started I cannot see abything about this. Please, is there something I a not doing or doing incorrectly? Are there IDEAL SETTINGS that i should implement to get the best rendering of all images used in the metaslider? This is the main thing that is plaguing me at the moment.
I do have one other question please. It has to do with text and the page builder and fonts style/customization. I am using the page builder to make all my pages, but would like to have some flexibility with customizing the fonts. Is there anything I can do or maybe another plugin that I should access. Or is there a feature i need to activate?
Thanks so much!
-Brian

URL: http://www.wisegroupintl.com

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 3 months ago Andrew Misplon
    Hi, I Work Here

    Hi Brian

    Thanks for reaching out.

    100% width sliders are always tricky. There is no set width for your images, they will render full screen so the width they render at depends on the display in use. You have two stretch options:

    1. Our stretch option which maintains height and zooms the image to maintain aspect ration.
    Appearance > Theme Settings > Home > Stretch Home Slider.

    2. OR turn 1 off and use Meta Slider full width. You can find that at Meta Slider > Advanced > 100% Width. That’ll stretch your slider without maintaining the height. The result is a bit different to option 1.

    Meta Slider Free doesn’t have layering but Greg covers the Vantage method of layering with free here:

    https://siteorigin.com/vantage-documentation/slider/

    The idea with layering is your background image is free to scale and your text stays fixed.

    With Meta Slider > Sizes on the right I usually go with 1904px width and whatever height I’m looking for. 1904 gives me an exact fit on my 23″ monitor with scaling after that. I reckon that covers a large portion of the displays out there.

    Most likely option 2 above is what you’re after.

  2. 9 years, 3 months ago briandw

    Andrew, sorry for the delay, but it has been crazy!!!

    Thanks for the info. I will try this and see what happens. I ended buying the metaslider pro (?) so i should have the layering capability, but it realy is the image size and focus that i'm struggling with here. in case this helps, what i want is exactly the same as the demo slider of the basketball player, the standard slider image that come with the original theme. i wnt mine to look exactly like that so if you have any other information that would allow me to accomplish that i would greatly appreciate it. i will also try matcha labs again , dave shaw. and see if he has any other info that could help. this is the only thing hanging me up at the moment.

    While i've got you though, is there any option with regard to the font for the vanatage theme? meaning, can i change the font or make it bold, etc?
    i can get by with it as is, but it would be great to be able to add some bold text in certain areas.

    thanks for your help!

  3. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Pro will help with proper layering. The link I originally sent covers exactly how we created the demo slider. In the case of Meta Slider Pro you don’t need to use the Caption field to add the overlay image URL. Instead you can use the proper layering feature.

    Sure, font selection can be found at Appearance > Customize > Theme Design > Fonts.

    Bolding text would usually be done on a page by page basis. If you’re working in the regular Visual tab you can highlight text and use the B button. If you’re working with text in Page Builder, use the Visual Editor widget and then the same B button. B for Bold.

    Hope that helps.

  4. 8 years, 11 months ago briandw

    Andrew, Can you please direct me to someone who can help me with this? I’ve just revisited it after too much time off and I simply cannot do it. I am wasting a lot of time.

    Is there someone you can recommend from Fiverr or Elance?

    I have just 3-4 images – maybe one video of me welcoming people only if they click on it to hear / view it though as i don;t want to force them to watch it.

    I want it to be the same heigth and width as the demo slider on the vantage theme. The one with the basketball player.

    I also want to overlay / layer some text on the image.

    Who can I hire? Anyone you kow of? I’m hoping I wont have to pay more than $100 as I’m sure it wont take someone who knows what they are doing that long.

    Thanks!

    Again, I own the pro version of both Vanatage and Metaslider.
    -Brian

  5. 8 years, 11 months ago Andrew Misplon
    Hi, I Work Here

    Sorry to hear you haven’t resolved. We’ve all spent a long time in web development here at SiteOrigin so we can really appreciate the frustration of not overcoming an obstacle. If you have a small budget then this really isn’t a bad way to proceed. Can you perhaps start with Codeable and see how that process goes?

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More