Jump to content


Photo
- - - - -

$content_width support?

jetpack gallery width

  • Please log in to reply
29 replies to this topic

#1 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 26 April 2013 - 06:00 PM

Hi guys,

 

i am trying to work around jetpack tilled galleries and came across that the theme might not have this function specified.

 

I do not want to alter the theme functions for nothing so, according to this link,

 

Please Login or Register to see this Hidden Content

 

does pagelines defines what is needed?

 

something like:

2

Please Login or Register to see this Hidden Content

 

It needs to work for this

 

Please Login or Register to see this Hidden Content

 

I do not want to alter because the framework has the width adjuster so i do not know how the code will affect things around.



#2 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 26 April 2013 - 09:57 PM

Hi Denis

 

I've checked in the php reference and with one of our developers and its doesn't seem like we declare this in the framework. I can see the variable for the content-width but not along side asset. The devleoper confirmed that is usually declared globally in a normal theme and is used for media but it's not something that they think we've included.

 

Looking at the link it states if the command isn't defined it will alter to 500px wide, is this whats happening on your site? If so you might be able to alter this manually using css.

 

If you have this active on a page we can take a look at, please let zap us a url and we'll take a look.



#3 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 26 April 2013 - 11:20 PM

Hi,

 

thank you for replying. Yes, everything goes to 500px when i am trying to create tilled galleries.

 

I have created a test page with several galleries with different displays so you can have a look.

 

I would very much appreciate if this can be solved somehow in a non intrusive way (altering php, css too much).

 

here is the link

 

Please Login or Register to see this Hidden Content



#4 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 26 April 2013 - 11:45 PM

Hi there, had a look for you. Seems to be easy enough to fix with css, just one line of code seems to get it back in alignment by fixing the image size.

 

Try

 

Please Login or Register to see this Hidden Content

That gives this layout -

Please Login or Register to see this Hidden Content

 



#5 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 27 April 2013 - 04:13 PM

Thank you James.

 

I used the code, you can check again.

 

The code you provided only solves the problem for one of the gallery types, the basic one, which is available without jetpack also. For the other types of galleries the problem is still there and still related to the width thing i think. :(



#6 Danny

Danny

    Is Awesome!

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

Posted 28 April 2013 - 08:52 AM

As far as I can (I could be wrong) see the the images from the other galleries, are in separate divs. Therefore, this is not related to width, the images appear on a new line as they're in different divs.

 

Please Login or Register to see this Hidden Content



#7 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 28 April 2013 - 10:20 AM

Hi Danny,

 

the images are inside a div but there are a series of dividers. The one controlling the width is above the one you showed me in your last screenshot.

 

I have attached a new screenshot, where you can see that the main div for the gallery contains the divs for rows which i tried to alter and nothing happens. This controls the width of the row with images under it i think.

 

That main div gets an attribute:

Please Login or Register to see this Hidden Content

because the width attribute from the topic title is not defined.

 

I am new with css, php, i do not know how alter subclasses and i do not want to risc to break more stuff as that data-original-width might affect more.

 

Here is the link to the screenshot.

 

Please Login or Register to see this Hidden Content



#8 Danny

Danny

    Is Awesome!

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

Posted 28 April 2013 - 10:50 AM

No, you have missed the point, even if you change the width, each row is a separate div called gallery-row. In order to make these gallery appear side by side, you're going to need to add some custom CSS float:left to the gallery-row class and increase the width of your site.

 

The reason to increase the width of your site is the images are two large to be side by side unless you either increase the width of your sites content area or you reduce the image size.

 

I increased the sites width to 1080px, added a float:left; to the gallery-row class and get the following result.

 

Please Login or Register to see this Hidden Content



#9 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 29 April 2013 - 05:17 PM

Thank you again Danny.

 

I would like to keep my actual width. The site is addressed to persons with very low incomes, that might have received a computer from someone and the internet is used to find help as it is an NGO related to cancer and leukaemia. Every day, after testing stuff the site is reduced to more simple code and effects. The screen resolution for many is still 1024 x 768 px for some. i need to fit in the window.

 

I need to reduce codes in time and in the same time be able to insert easy but appealing content to make them come, experiment, discover, evolve. I know this does not matter here but, it may explain why i am so "stubbornness"...

 

So, just keep this at it is and, hope in time, some changes with jetpack or in the theme core... problem solved?



#10 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 30 April 2013 - 04:17 AM

Hi Denis, reading through the jetpack link -

Please Login or Register to see this Hidden Content

it says you can add the code directly if the site/theme doesn't include it already.

 

Try adding the isset! code to the functions.php of a child theme instead of using css, set a width which matches the width of your content area.

Please Login or Register to see this Hidden Content



#11 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 30 April 2013 - 11:18 AM

Thank you James.

Inserted the code, 2 problems solved, new one emerged.

For the pages that are have one sidebar, left for example, the content width is 766px in my case.
For the pages that are full width, the content is 940 px.

When i inserted the code with 766 looks great on pages with the sidebar, and some white space (174px the difference from the full wdith 940px page) on the full dith pages.
When i altered the code to 940 thinking that if i specify the "maximum" width a page can have, the galleries have partially hidden images.

Any last help on how to combine these two widths?

 

This is why i said in my first entry that

 

"I do not want to alter because the framework has the width adjuster so i do not know how the code will affect things around."

 

here are some screenshots

Please Login or Register to see this Hidden Content



Please Login or Register to see this Hidden Content



Thank you again for replying, means a lot.


Edited by Denis Ciumbargi, 30 April 2013 - 01:19 PM.


#12 Danny

Danny

    Is Awesome!

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

Posted 30 April 2013 - 11:34 AM

Can you provide a link to both pages which have the two different layouts, so we can take a closer look.



#13 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 30 April 2013 - 01:15 PM

Sure Danny.

 

the page with the one sidebar is the same:

 

Please Login or Register to see this Hidden Content

 

And the full dith gallery for testing is on this page:

 

Please Login or Register to see this Hidden Content

 

at this moment the content width is 940 to match the full width.

Please Login or Register to see this Hidden Content



#14 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 01 May 2013 - 05:26 AM

Hi there, I've scoured the web and it seems it is possible to declare various widths based on the template/page, for example if the page was using the one-sidebar-right layout you could specify a width for it. However it seems it would need a complex hook which would mean more code, which was something you were trying to avoid. However, just in case I've attached link below in case you want to take a look at it. To be honest I'm not sure how that would be implemented in the framework, or even if it would work 100%.

 

Please Login or Register to see this Hidden Content

 

As usually the content width only gets declared once, I would think the safest thing to do would be to declare the width as the figure for the sidebar layout, that should then work on both pages without formatting issues, although on the full width page it wouldn't stretch the entire page width, if centered it might not notice too much, depends on the size of the sidebar.

 

If you can set the width to the sidebar layout version so we can see how that looks on a full width page, we might be able to see if css could help in adjusting the width a little more to make it sit on the full width page better.



#15 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 01 May 2013 - 09:18 AM

Thank you @

Please Login or Register to see this Hidden Content

.

 

I have changed the content width to 766px, the size for the one side bar layout.

 

The link remain the same to test around.

 

Please Login or Register to see this Hidden Content

 for one side bar

 

and

 

Please Login or Register to see this Hidden Content

 for a full page layout.

 

I have also thought of keeping the content width to the layout of a one sidebar page and to center but, before i will keep that as final solution just wanted to not give up the fight and try until... well, until i am sure the fight is over :)

 

Crazy fun thing... Sometimes is like, who is better, me, us or the code? :))

Thank you guys for the support, i know it is just a line of words but i relly mean it! Thanks!

Hope there will be a happy ending on this one.



#16 Danny

Danny

    Is Awesome!

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

Posted 01 May 2013 - 10:13 AM

Hi,

 

From what I can see, this is now working correctly, I am not sure what you're trying to achieve now on your full width pages ?



#17 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 02 May 2013 - 01:53 PM

@

Please Login or Register to see this Hidden Content

- i am trying to have a gallery that on full width pages goes to full width of the page and not to keep the content width of the one side bar content. I am trying to have a gallery on pages with one sidebar that do not have partially hidden content because the content width specified in the theme functions manually are bigger to match the full width size settings of the page.

 

@

Please Login or Register to see this Hidden Content

- Jetpack just released a bug fix on 2.2.5 version saying this:

 

Bug Fix: Custom CSS: Allow the content width setting to be larger than the theme's content width.

 

Maybe these two can work now together?



#18 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 03 May 2013 - 12:13 AM

Reading the change log for jetpack, I read that as you can set the width of the gallery outside of the standard content width of the theme, not sure if that would apply for the different layouts of the template though or just larger than the the full width layout.

 

It's worth a try though to see if it has an effect on the sidebar layout to see if it respects the width of the template width when reduced after the update.

 

I've tried using css to make a change on the full width page with the reduce content-width on it, but I can't find a way to get it to work without changing for each image as the styles seem to be applied inline :-(



#19 Denis Ciumbargi

Denis Ciumbargi

    Advanced Member

  • Members
  • 66 posts
  • Framework Version:DMS Pro
  • Country: Country Flag

Posted 03 May 2013 - 10:42 AM

@

Please Login or Register to see this Hidden Content

- Well, thank you...

 

I shall try to keep the content width size in theme functions to 766 as for my one sidebar layout page width and... maybe in the future this can be sorted out.

 

Is bad that a solution is hard to find as Jetpack is a top plugin, used by millions and these gallery functions helps users to have less plugins, to replace nextgen gallery or any other combination of plugins in order to create these galleries. It is all about simplicity for the common user.

 

Well, heads up high for a solution in the future, thank you again.

 

If any updates on these, i would love to have them :D



#20 Danny

Danny

    Is Awesome!

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

Posted 03 May 2013 - 11:06 AM

I will bring this to our developers attention to see if anything can be done in the future.

 







Also tagged with one or more of these keywords: jetpack, gallery, width