Jump to content


Photo
- - - - -

Change parameters of a media box? DMS2

Media box border url gap dms2

Best Answer Aires , 03 May 2014 - 06:29 PM

I was playing around and it might be best to get the measurements needed for the entire column area and media boxes and go into photoshop or what ever you prefer and cut the images out of the whole image with the gaps in mind

 

 

then you could upload the whole image as the column background and take the pieces you cut out for the media boxes. Very tricky 

Go to the full post


  • Please log in to reply
10 replies to this topic

#1 bjs198

bjs198

    Advanced Member

  • Members

  • 88 posts
  • LocationTianjin, PRC
  • Framework Version:DMS 2.x
  • Country: Country Flag

Posted 03 May 2014 - 01:11 AM

Hey team,

 

Mucking about with a page layout (http://37.128.132.15...ji/our-promise/) and am wondering how I might go about doing the following:

 

1) Adding an html link to each media box

 

2) Adding a border to each media box

 

3) Reducing the gap between the 4 adjacent media boxes so they sit closer together

 

Not sure if this should be 3 topics or one, let me know and I can revise :)

 

Cheers

 

Barney



#2 Aires

Aires

    Advocate

  • Members

  • 333 posts
  • LocationAlabama
  • Framework Version:DMS2
  • Country: Country Flag

Posted 03 May 2014 - 04:03 AM

Hi,

To add a link with your image you are going to have to use this bit of code

 

<a href="Where they go once they click - URL"><img src="LINK TO IMAGE URL"></a>

 

And for the border you could do something like this using custom styling more on that here http://docs.pageline...on-area-styling

 

.media-border {

  border:2px solid #1d1d1d;

  }

 

And add (media-border or what ever you call it) to the media boxes custom style box

 

More on borders here http://www.w3schools.../css_border.asp

 

Hope this helps


  • James B and bjs198 like this

#3 bjs198

bjs198

    Advanced Member

  • Members

  • 88 posts
  • LocationTianjin, PRC
  • Framework Version:DMS 2.x
  • Country: Country Flag

Posted 03 May 2014 - 11:09 AM

Ahhhh that's how you use the custom style box :)

 

Well today has been a long day of learning for me lol!!

 

Thanks Aires, very much appreciated :)



#4 bjs198

bjs198

    Advanced Member

  • Members

  • 88 posts
  • LocationTianjin, PRC
  • Framework Version:DMS 2.x
  • Country: Country Flag

Posted 03 May 2014 - 01:41 PM

Any idea's for number 3) closing the gap? I've tried playing around with padding for the individual media boxes but am not getting anywhere fast...



#5 Aires

Aires

    Advocate

  • Members

  • 333 posts
  • LocationAlabama
  • Framework Version:DMS2
  • Country: Country Flag

Posted 03 May 2014 - 05:50 PM

Hi,

here my attempt to recreate what you are trying to do http://mytestdesigns.pw/ .

 

First off it appears that you have 2 media boxes in one column and 2 in another might be best to have them all in one column.

 

Also I noticed that you images are not as big as your media boxes the images are 500x332px and the media box is 520x364px. Might be best to make the images the size of the box so that it fills out.

Now as for the space in between the media boxes in the past I have achieve the effect of 4 media boxes with no space between them by adding a background to the column. This is a lot easier if you are working with solid colors but can be tricky when working with images and getting them to align with the image in the media boxes but very doable.

 

CSS would be like this:

 

.my-back-area {

    background-image: url(image url here)

}

And add the my-back-area to the custom style of the column.

 

I would recommend you try this on a separate page there is no need to destroy what you have already done. and if it works then carry it over.

 

Hope this helps

 

there may be another way that I don't know of


Edited by Aires, 03 May 2014 - 06:00 PM.

  • batman likes this

#6 Aires

Aires

    Advocate

  • Members

  • 333 posts
  • LocationAlabama
  • Framework Version:DMS2
  • Country: Country Flag

Posted 03 May 2014 - 06:29 PM   Best Answer

I was playing around and it might be best to get the measurements needed for the entire column area and media boxes and go into photoshop or what ever you prefer and cut the images out of the whole image with the gaps in mind

 

 

then you could upload the whole image as the column background and take the pieces you cut out for the media boxes. Very tricky 


Edited by Aires, 03 May 2014 - 06:31 PM.


#7 bjs198

bjs198

    Advanced Member

  • Members

  • 88 posts
  • LocationTianjin, PRC
  • Framework Version:DMS 2.x
  • Country: Country Flag

Posted 03 May 2014 - 10:26 PM

That's amazing Aires!!!! Thank you so much for taking the time out to help, what a great community here :) I'll let you know how I get on and which way I take it, I think you're right though, it's tricky!! The client is an ex-art teacher and wants it this way but I'm going to try to persuade them otherwise else I have 7 pages to create this way :S

 

I'm toying with the idea of loading the base image as a bg and then using text boxes to overlay the links... the only thing is keeping everything aligned when the browser changes size...



#8 Aires

Aires

    Advocate

  • Members

  • 333 posts
  • LocationAlabama
  • Framework Version:DMS2
  • Country: Country Flag

Posted 03 May 2014 - 11:43 PM

Np,  

just  upload the image without the text as the column bg and use transparent images with the text in the media boxes and it should work
Sent from my Lumia 900 using Tapatalk


Edited by Aires, 03 May 2014 - 11:48 PM.


#9 Danny

Danny

    Is Awesome!

  • Moderators
  • 17580 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 04 May 2014 - 09:42 AM

Is this issue now resolved ?



#10 bjs198

bjs198

    Advanced Member

  • Members

  • 88 posts
  • LocationTianjin, PRC
  • Framework Version:DMS 2.x
  • Country: Country Flag

Posted 04 May 2014 - 09:54 AM

Yes very much so :) Couldn't see a way to mark it as solved though...



#11 Danny

Danny

    Is Awesome!

  • Moderators
  • 17580 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 04 May 2014 - 10:33 AM

No problem, I have marked it as resolved for you.


  • bjs198 likes this





Also tagged with one or more of these keywords: Media box, border, url, gap, dms2