Gallery description problems

AllenAllen Registered Users Posts: 10,013 Major grins
edited February 16, 2014 in SmugMug Customization
All of a sudden I'm having problems of two div's formatting in a gallery description. I have over 900
galleries that this method works. Here's a working one.
http://www.photosbyat.com/Birds/Birding-2013-April/2013-04-20-Garganey/i-tRPf5Ls

Here's the first one that went bonkers.
http://www.photosbyat.com/Birds/Birding-2013-February/2013-FEB-17-28-Yardbirds/i-n3Chp7L

I copied out a working gallery html and pasted it in and it also went bonkers.

Looks like everytime the description is saved it goes bonkers.

I copied the original borked gallery html and pasted in a working gallery and it went bonkers.
Them put back in the working gallery html and it went bonkers.

Using WebDev I removed all CSS and it didn't fix it, remained borked.

I'm thinking Smugmug updated some code that's affecting this. Because if I paste into any gallery
this happens.

Here's the html that I've used in over 900 galleries with no problems. 
<div style="font-size: 13pt; max-width: 560px; ">
Yardbirds Feb. 17-28 &#8226; See <a href="/Birds/Birding-2013-February/2013-FEB-07-16-Yardbirds/i-JcwPLMm">Feb 07-16 here</a><br />
Birds around the yard.  All photos shot out our kitchen window.<br />
Newest photos first in gallery, See date in caption below main photo.<br />
<a href="/Birds/Birding-2013-February"><u>Click to Return to February galleries</u></a>
</div>

<div class="birdjump" style="max-width: 480px; text-align:center; ">
  <span style="color:blue; font-size: 10pt;">Jump to &gt;&gt;
    <a class="nav" href="/Birds/Birding-2012-December">Dec 2012</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-January">Jan 2013</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-February"><font><b>February</b></font></a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-March">March</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-April">April</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-May">May</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-June">June</a> <br />
    <a class="nav" href="/Birds/Birding-2013-July">July</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-August">August</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-September">September</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-October">October</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-November">November</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2013-December">Dec 2013</a> &#8226; 
    <a class="nav" href="/Birds/Birding-2014-January">Jan 2014</a> 
    <br />
  </span>
    <span style="color:blue; font-size:13pt;"><b>Click on main photo below for larger version</b></span>
</div>
Al - Just a volunteer here having fun
My Website index | My Blog

Comments

  • carolinecaroline Registered Users Posts: 1,302 Major grins
    edited February 15, 2014
    Allen wrote: »
    All of a sudden I'm having problems of two div's formatting in a gallery description. I have over 900
    galleries that this method works. Here's a working one.
    http://www.photosbyat.com/Birds/Bird...aney/i-tRPf5Ls

    Here's the first one that went bonkers.
    http://www.photosbyat.com/Birds/Bird...irds/i-7mfq9B3

    I copied out a working gallery html and pasted it in and it also went bonkers.

    Looks like everytime the description is saved it goes bonkers.

    I copied the original borked gallery html and pasted in a working gallery and it went bonkers.
    Them put back in the working gallery html and it went bonkers.

    Using WebDev I removed all CSS and it didn't fix it, remained borked.

    I'm thinking Smugmug updated some code that's affecting this. Because if I paste into any gallery
    this happens.

    Here's the html that I've used in over 900 galleries with no problems. 
    <div style="font-size: 13pt; max-width: 560px; ">
Yardbirds Feb. 17-28 • See <a href="/Birds/Birding-2013-February/2013-FEB-07-16-Yardbirds/i-JcwPLMm">Feb 07-16 here</a><br />
Birds around the yard.  All photos shot out our kitchen window.<br />
Newest photos first in gallery, See date in caption below main photo.<br />
<a href="/Birds/Birding-2013-February"><u>Click to Return to February galleries</u></a>
</div>

<div class="birdjump" style="max-width: 480px; text-align:center; ">
  <span style="color:blue; font-size: 10pt;">Jump to &gt;&gt;
    <a class="nav" href="/Birds/Birding-2012-December">Dec 2012</a> • 
    <a class="nav" href="/Birds/Birding-2013-January">Jan 2013</a> • 
    <a class="nav" href="/Birds/Birding-2013-February"><font><b>February</b></font></a> • 
    <a class="nav" href="/Birds/Birding-2013-March">March</a> • 
    <a class="nav" href="/Birds/Birding-2013-April">April</a> • 
    <a class="nav" href="/Birds/Birding-2013-May">May</a> • 
    <a class="nav" href="/Birds/Birding-2013-June">June</a> <br />
    <a class="nav" href="/Birds/Birding-2013-July">July</a> • 
    <a class="nav" href="/Birds/Birding-2013-August">August</a> • 
    <a class="nav" href="/Birds/Birding-2013-September">September</a> • 
    <a class="nav" href="/Birds/Birding-2013-October">October</a> • 
    <a class="nav" href="/Birds/Birding-2013-November">November</a> • 
    <a class="nav" href="/Birds/Birding-2013-December">Dec 2013</a> • 
    <a class="nav" href="/Birds/Birding-2014-January">Jan 2014</a> 
    <br />
  </span>
    <span style="color:blue; font-size:13pt;"><b>Click on main photo below for larger version</b></span>
</div>

    Hi Allen, <img src="https://us.v-cdn.net/6029383/emoji/wave.gif&quot; border="0" alt="" >
    Both links show page not found, otherwise loving your new look.
    Caroline
    Mendip Blog - Blog from The Fog, life on the Mendips
    www.carolineshipsey.co.uk - Follow me on G+

    [/URL]
  • JtringJtring Registered Users Posts: 675 Major grins
    edited February 15, 2014
    Allen,

    The links 404 and the descriptions in your galleries don't look quite like your snippet. Most seem to start look like what's below. Note the left and right floats. Have you possibly been copying some old code?

    Jim Ringland
    jtringl.smugmug.com

    <div id="yui_3_8_0_1_1392446503660_1885" style="float:left; font-size: 13pt;">
    Clarence Cannon National Wildlife Refuge
    <br></br>
    <a id="yui_3_8_0_1_1392446503660_1927" href="/Birds/Birding-2010-May">
        <u id="yui_3_8_0_1_1392446503660_1926">
            Click to Return to May galleries
        </u>
    </a>
</div>
<div id="yui_3_8_0_1_1392446503660_1886" class="birdjump" style="max-width: 480px ;float:right; text-align:center;">
    <span style="color:#00F; font-size: 10pt;">
        Jump to >>
        <a class="nav" href="/Birds/Birding-2009-December">
            Dec 2009
        </a>
         •
    et cetera
    Jim Ringland . . . . . jtringl.smugmug.com
  • JtringJtring Registered Users Posts: 675 Major grins
    edited February 15, 2014
    Forgot to add: astonishingly wonderful bird photos. I really, really liked the two bald eagles displaying. And I haven't even gotten to the wildflowers yet. -- Jim Ringland
    Jim Ringland . . . . . jtringl.smugmug.com
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 15, 2014
    Fixed the links.
    Thanks Caroline
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 15, 2014
    Jim the links are fixed.

    I use that exact code except for the guts of the div's on over 900 galleries and they all worked except
    for the ones edited this afternoon.

    If you look at what you posted Smug inserts all those yui id's, it normal.
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 15, 2014
    On all my replies above not one quote is showing in my reply box?

    Did I toggle something in my profile to not show quotes? Have not been in
    my profile for along time.
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • JtringJtring Registered Users Posts: 675 Major grins
    edited February 15, 2014
    Take a second look at what's in the style=" ... " blocks for the div's on the Garganey page and Yardbirds page. They aren't the same. -- Jim Ringland
    Jim Ringland . . . . . jtringl.smugmug.com
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 15, 2014
    Jtring wrote: »
    Take a second look at what's in the style=" ... " blocks for the div's on the Garganey page and Yardbirds page. They aren't the same. -- Jim Ringland
    Look the same to me. (both copied from current description box) 
    <div style=" font-size: 13pt;">
[COLOR=Red]Garganey[/COLOR] ...
</div>

<div class="birdjump" style="max-width: 480px ; text-align:center;">
<span style="color:blue; font-size: 10pt;">Jump to &gt;&gt;
...
</span>
    <span style="color:blue; font-size:13pt;"><b>Click on main photo below for larger version</b></span>
</div>

================

<div style=" font-size: 13pt;">
[COLOR=Red]Yardbirds[/COLOR]...
</div>

<div class="birdjump" style="max-width: 480px ; text-align:center;">
<span style="color:blue; font-size: 10pt;">Jump to &gt;&gt;
...
</span>
    <span style="color:blue; font-size:13pt;"><b>Click on main photo below for larger version</b></span>
</div>
    As a test I copied a good working gallery description html and pasted in bad gallery and it borked.

    BTW, I'm just a hobbyist birder and use my galleries like a journal documenting what I see.
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 15, 2014
    I've tried all kinds of float right, left, display inlines but can't get anything to work on the two div's.
    I have not tried FlexBox yet although used that method here for first try at it.
    http://www.photosbyat.com/Birds/Missouri-Bird-Photos-H-Z/i-n72HZ8H
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • JtringJtring Registered Users Posts: 675 Major grins
    edited February 15, 2014
    I don't claim to know what's going on, but here's what the beginning of second div in the Garganey description looks like when I examine it with the Firefox inspector. SM adds the yui business, but I would have thought the rest would match your input. In any case, what's below seems to be live and it's the float:right that's sending the birdjump block to the right side of the screen for that gallery. No float:right in Yardbirds, so it's below. -- Jim Ringland
    <div id="yui_3_8_0_1_1392449399664_1938" class="birdjump" style="max-width: 480px ;float:right; text-align:center;">
    <span id="yui_3_8_0_1_1392449399664_1939" style="color:#00F; font-size: 10pt;">
        Jump to >>
        <a class="nav" href="/Birds/Birding-2012-December"></a>
         &#8226; 
        <a class="nav" href="/Birds/Birding-2013-January"></a>
         &#8226;
    Jim Ringland . . . . . jtringl.smugmug.com
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 15, 2014
    I added an HTML widget above the gallery description and the same code works in it.

    http://www.photosbyat.com/Birds/Birding-2013-February/2013-FEB-17-28-Yardbirds/i-n3Chp7L
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 15, 2014
    Jtring wrote: »
    Take a second look at what's in the style=" ... " blocks for the div's on the Garganey page and Yardbirds page. They aren't the same. -- Jim Ringland
    Jtring wrote: »
    I don't claim to know what's going on, but here's what the beginning of second div in the Garganey description looks like when I examine it with the Firefox inspector. SM adds the yui business, but I would have thought the rest would match your input. In any case, what's below seems to be live and it's the float:right that's sending the birdjump block to the right side of the screen for that gallery. No float:right in Yardbirds, so it's below. -- Jim Ringland
    <div id="yui_3_8_0_1_1392449399664_1938" class="birdjump" 
          style="max-width: 480px ;[COLOR="Red"]float:right;[/COLOR] text-align:center;">
    <span id="yui_3_8_0_1_1392449399664_1939" style="color:#00F; font-size: 10pt;">
        Jump to >>
        <a class="nav" href="/Birds/Birding-2012-December"></a>
         &#8226; 
        <a class="nav" href="/Birds/Birding-2013-January"></a>
         &#8226;
    This is copied straight out of the current Garganey gallery description. No floats showing? 
    <div style=" font-size: 13pt;">
Garganey found just west of Sumner besides hwy 139 in Chariton County <br>
Potential 2nd MO state record <br><a href="/Birds/Birding-2013-April"><u>Click to Return to April galleries</u></a>
</div>

<div class="birdjump" style="[COLOR="Red"]max-width: 480px ; text-align:center[/COLOR];">
<span style="color:blue; font-size: 10pt;">Jump to &gt;&gt;
<a class="nav" href="/Birds/Birding-2012-December">Dec 2012</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-January">Jan 2013</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-February">February</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-March">March</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-April"><font><b>April</b></font></a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-May">May</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-June">June</a> <br><a class="nav" href="/Birds/Birding-2013-July">July</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-August">August</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-September">September</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-October">October</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-November">November</a> &#8226; 
<a class="nav" href="/Birds/Birding-2013-December">Dec 2013</a> &#8226; 
<a class="nav" href="/Birds/Birding-2014-January">Jan 2014</a> 
<br></span>
    <span style="color:blue; font-size:13pt;"><b>Click on main photo below for larger version</b></span>
</div>
<div style="clear: both;"></div>
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 15, 2014
    This is what I ended up with. Added class to first div

    <div class="birdGalDesc" style="font-size: 13pt; max-width: 560px;">
    ...
    <div class="birdjump" style="max-width: 480px ; text-align:center;">
    ...

    It looks like the gallery description will not recognize the floats in the html so added it in the CSS.
    Added this to "all galleries" CSS

    /* fix for bird gallery description */
    .birdGalDesc {float:left;}
    .birdjump {float:right;}

    I currently have this is over 900 galleries without either div float and it works.
    <div style=" font-size: 13pt;">
    <div class="birdjump" style="max-width: 480px ; text-align:center;">

    At least if I run in to this problem again I can just add the 1st div class name to fix it.
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • ChancyRatChancyRat Registered Users Posts: 2,141 Major grins
    edited February 16, 2014
    Allen this thread has sent me into a quaking fear.
    If I open an html block, will the code self-destruct?
    I'm not going to edit anything until I understand this.
    ... thinking it will be a sleepless night...:cry
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 16, 2014
    ChancyRat wrote: »
    Allen this thread has sent me into a quaking fear.
    If I open an html block, will the code self-destruct?
    I'm not going to edit anything until I understand this.
    ... thinking it will be a sleepless night...:cry
    HTML blocks are only in NewSmug and I've seen no problems with them. It's the gallery description
    that's going bonkers for me. I used tables in legacy but Smug removes the table code in NewSmug.
    It all works until you edit the description. Most I can fix, but one at a time.

    Most all I had to do is assign div class name and add CSS.

    But I had to switch to a FlexBox for where the table code was removed and I had to switch to multiple div's.
    http://www.photosbyat.com/Birds/Missouri-Bird-Photos-A-G/i-TN7c4SW

    I worked this one last night getting it all lined up and adding MAP code.
    http://www.photosbyat.com/Birds/2006-Birds-of-Japan/i-xdcVPtJ
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • ChancyRatChancyRat Registered Users Posts: 2,141 Major grins
    edited February 16, 2014
    Allen wrote: »
    HTML blocks are only in NewSmug and I've seen no problems with them. It's the gallery description
    that's going bonkers for me. I used tables in legacy but Smug removes the table code in NewSmug.
    It all works until you edit the description. Most I can fix, but one at a time.

    Most all I had to do is assign div class name and add CSS.

    But I had to switch to a FlexBox for where the table code was removed and I had to switch to multiple div's.
    http://www.photosbyat.com/Birds/Missouri-Bird-Photos-A-G/i-TN7c4SW

    I worked this one last night getting it all lined up and adding MAP code.
    http://www.photosbyat.com/Birds/2006-Birds-of-Japan/i-xdcVPtJ

    Last night for the first time in maybe 30 years I couldn't go to sleep until 3:00 am. When 11 PM is my norm. :cry
    So Allen are you saying that you had left some older legacy html and table code in some descriptions, when you unveiled? Or had you updated them in preparation for New, working within the new restrictions, and the code still broke in the Description fields?
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited February 16, 2014
    ChancyRat wrote: »
    Last night for the first time in maybe 30 years I couldn't go to sleep until 3:00 am. When 11 PM is my norm. :cry
    So Allen are you saying that you had left some older legacy html and table code in some descriptions, when you unveiled? Or had you updated them in preparation for New, working within the new restrictions, and the code still broke in the Description fields?
    I have over 900 bird galleries and ALL my changes including adding new galleries and editing a few
    before unveiling was done switching to legacy. Some descriptions used tables so I edited them in
    legacy in preparation. All legacy descriptions used html tags which were missing in NewSmug so I could
    not edit in NewSmug or the html tags would disappear in legacy and bork that view.
    Al - Just a volunteer here having fun
    My Website index | My Blog
Sign In or Register to comment.