Jump to content
Sign in to follow this  
vanessacallaway

Please help- customize image sizes, hover font color

Recommended Posts

vanessacallaway    0
vanessacallaway

Hi there, if you're reading this, thank you for reading! 

I am desperately trying to put two images side by side, with a small margin of space between them. And I would also like to figure out how I would put two horizontal pictures atop each other (like a typical blog post, one pict atop another) but change the image size, ex: The top one would look more square and the bottom would be equal in width but not in height?!

 

Thanks again in advance!!

 

Vanessa

Share this post


Link to post
Share on other sites
James B    436
James B

Hi Vanessa,

 

You could use the Pagelines Grid to display your images. The grid will split the area up into columns using shortcodes. You can then place your image inside the shortcode to get it to display in the required layout. See the grid section here - http://demo.pagelines.me/tools/

 

Otherwise you could put the images together in the correct format in a photo editor like photoshop and save as one image, then upload.

 

Hope this helps


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
vanessacallaway    0
vanessacallaway

Hi James,

 

Thanks for responding.. how do I get/use Pagelines Grid.. do I have to pay more for it?

 

Thanks,

Vanessa

Share this post


Link to post
Share on other sites
vanessacallaway    0
vanessacallaway

Hi Catrina,

 

Thanks for responding.. I guess maybe I'm not reading it right.. Is the Grid something I get like a plug in or how do I use it?? I'm not seeing where I put in on my site?

 

Thanks,

Vanessa

Share this post


Link to post
Share on other sites
Rob    547
Rob

Hi Vanessa,

 

You can use the Grid System code found here: http://demo.pagelines.me/tools/ in a post, page or text widget. If using it in a Post or Page, make sure to select the Text view. You'll find the code shown there. You can, for example, use something like this:

<div class="row">
<div class="span4">The top image </div>
/div>
<div class="row">
<div class="span4">The bottom image</div>
/div>

Make sure you replace the language I inserted above with the proper HTML for the image (and any link).

 

If you need additional explanation, please let us know.


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
vanessacallaway    0
vanessacallaway

Hi Rob.. Its not working! Thanks for you response.. I'm feeling a bit amateur.. Where would I put the HTML links for the images.. For example, I have two pictures I'd like to put side by side in the same line...what exactly do I need to write?

 

Thanks!

Share this post


Link to post
Share on other sites
James B    436
James B

Hi there, you need to paste your code into the text view of the page/post. You can access this via the text tab in the top right hand corner of the wordpress editor on the post/page screen.

 

Then using Rob's code as an example you'd need to use

 

<div class="row">
<div class="span6">Your content </div>
<div class="span6">Your content </div>
</div>

Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Similar Content

    • Michael Kummer
      By Michael Kummer+
      Hi guys,
      I have noticed that all thumbnails on www.michaelkummer.com are scaled down in CSS or HTML, rather than on the backend by Jetpack's Photon. See https://db.tt/vNJCn7Gh and https://db.tt/3ZpkHM7G. 
      Any idea why Pins sets the image width and height to something much larger than what's shown on the screen? Is there any way to fix this so that Photon can do a better job in rescaling the images on the backend before they are delivered to the browser?
      Thanks
      Michael 
    • casseysdesigns
      By casseysdesigns+
      In the past I would use nextbox for this task. However, Platform 5 does not have nextbox. I will do my best to describe what I am trying to do.
      I am creating a template for coaches, each product has its own link but they all share a common coach id. I want to set up the templates with the links for each product with a variable for the coach id so that I can change the coach id for all the links on the site by just changing the value of the variable $coachId. To do this I'll need to do something like the following...
      <a href="salesite.com/productcodes/referringRepId=<?= $coachId ?>" target="_blank">Product Purchase Link</a> Is it possible to do this with Platform 5?
    • sfmstudios
      By sfmstudios+
      I'm using the boxes section on a local development site to play around with some options, and running into an issue.  
      Have the following settings for the boxes:
      Type: Images/SVC Media on Top Image Appearance: Standard/Default Image/Icon Width: 280px Image Opacity: 100% Each of my box images is 280x150 in size, but the result of the image on the box is a strange zoomed-in, cropped square (see attached).  I looked to adjust border properties via CSS, but couldn't find a fix.  What solutions are out there?

    • richardjacruz
      By richardjacruz+
      I received our monthly Alexa report, and it pointed out that there were missing alt tags on EVERY page on our site. Upon closer inspection, it looks like the QuickSlider which is used for the scrolling banners at the top of the site doesn't bring in the alt tags. Recently, you made a change to the RevSlider to allow images to have "alt" tags. Can you do that for the QuickSlider too?
      Thanks.
    • jvheintze
      By jvheintze+
      I just tried to figure out how to use Lax in combination with Post Thumbnails the following way: instead of showing the Featured Image on top of the content section I would like to have a Lax section above the content which loads for each post the featured image. To do so it seems there should be some kind of word press hook support necessary (not ready yet)? Or did I miss something?
×