[ABD] Sidebar

Any abandoned Extensions will be moved to this forum.

WARNING: Extensions in this forum are not currently being supported or maintained by the original Extension author. Proceed at your own risk.
Forum rules
IMPORTANT: Extension Development Forum rules

WARNING: Extensions in this forum are not currently being supported nor updated by the original Extension author. Proceed at your own risk.
Locked
User avatar
Pixel8r
Registered User
Posts: 177
Joined: Mon Nov 30, 2009 4:39 pm
Contact:

Re: [DEV] Sidebar

Post by Pixel8r »

cece74 wrote:I've done the conversion. But unfortunately there would be put many settings and do not have time to do it. I have to keep my other ext. Sorry.
Thanks you are doing a great job on getting this converted to an extension. :)
24knews.com - We live on the edge of chaos.
User avatar
Dankees
Registered User
Posts: 246
Joined: Sun Jan 25, 2015 2:27 am

Re: [DEV] Sidebar

Post by Dankees »

This code that you posted changes the height of the Twitter feed, where? I want to move that first sidebar box down, so it's in line with the forums, and I want to move the date and time back on the right where they belong.

What does that 846px do?
Pixel8r wrote:This is the code I had in my sidebar.html for the twitter bit. You will notice the height adjustment;

Code: Select all

<div class="forabg" height: 846px;>
        <div class="inner"><span class="corners-top"><span></span></span>
        <ul class="topiclist">
            <li class="header">
                <dl class="icon">
                    <dt>Tweets</dt>
                </dl>
            </li>
        </ul>
        <ul class="topiclist forums" style="padding: 0.05cm">
<div align="center">
<a class="twitter-timeline" href="https://twitter.com/24kFeed/lists/the-24knews-feed" data-widget-id="344735649628307457" data-chrome="noheader" height="846">Tweets from https://twitter.com/24kFeed/lists/the-24knews-feed</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
        </div>
        </ul>
        <span class="corners-bottom"><span></span></span></div>
        </div>
User avatar
Dankees
Registered User
Posts: 246
Joined: Sun Jan 25, 2015 2:27 am

Re: [DEV] Sidebar

Post by Dankees »

I am so new to this. The settings that you adjusted in this file, what do they do? They move the boxes or change the sizes of them?
Pixel8r wrote:
Dankees wrote:That's OK, but is there a file that I can manually update myself to have the sidebars appear the way I would like?
Yes the sidebar.css file. This is how I adjusted mine;

Code: Select all

@media screen and (min-width: 950px){

#page-body {
    margin: 4px 0;
    clear: both;
    width:77%;
    float:left;
}  

 .page-sidebar {
float:right;
width:22%;
min-width: 192px;
} 
}
User avatar
Pixel8r
Registered User
Posts: 177
Joined: Mon Nov 30, 2009 4:39 pm
Contact:

Re: [DEV] Sidebar

Post by Pixel8r »

The bit you are looking for is in the sidebar.html file, I added the margin-top:44px styling.

Code: Select all

<div class="forabg" style="margin-top:44px;">
The next problem you will run into is that the top section needs a different adjustment for if you are logged in or not. This can be achieved via using IF statements and repeating code with different settings.

Code: Select all

<!-- IF S_USER_LOGGED_IN -->
Code here
<!-- ELSE -->
Code here
<!-- ENDIF -->
24knews.com - We live on the edge of chaos.
User avatar
Dankees
Registered User
Posts: 246
Joined: Sun Jan 25, 2015 2:27 am

Re: [DEV] Sidebar

Post by Dankees »

I will try that. How do you hide it in the mobile browsers?
User avatar
Pixel8r
Registered User
Posts: 177
Joined: Mon Nov 30, 2009 4:39 pm
Contact:

Re: [DEV] Sidebar

Post by Pixel8r »

Dankees wrote:I will try that. How do you hide it in the mobile browsers?
What happens when the screen gets below a certain height is that the sidebar shifts below the forum, which is how I have mine. You can control when it shifts in the CSS file

Code: Select all

@media screen and (min-width: 950px){
24knews.com - We live on the edge of chaos.
User avatar
Dankees
Registered User
Posts: 246
Joined: Sun Jan 25, 2015 2:27 am

Re: [DEV] Sidebar

Post by Dankees »

Pixel8r wrote:The bit you are looking for is in the sidebar.html file, I added the margin-top:44px styling.

Code: Select all

<div class="forabg" style="margin-top:44px;">
The next problem you will run into is that the top section needs a different adjustment for if you are logged in or not. This can be achieved via using IF statements and repeating code with different settings.

Code: Select all

<!-- IF S_USER_LOGGED_IN -->
Code here
<!-- ELSE -->
Code here
<!-- ENDIF -->
OK, I made it at 47px so it would be in line with the forum on the left. How do I get the text for "Last Logged In" and "Mark All Forums Read" above the sidebar?

With the IF/ELSE code you posted, what am I to do with that? What is that for? I didn't understand that part. What code do I want to put in there? Thank you so much!

Oh, and how do I hide it in the mobile browser? Thanks!!!!!!!!!!
User avatar
Pixel8r
Registered User
Posts: 177
Joined: Mon Nov 30, 2009 4:39 pm
Contact:

Re: [DEV] Sidebar

Post by Pixel8r »

Dankees wrote: OK, I made it at 47px so it would be in line with the forum on the left. How do I get the text for "Last Logged In" and "Mark All Forums Read" above the sidebar?

With the IF/ELSE code you posted, what am I to do with that? What is that for? I didn't understand that part. What code do I want to put in there? Thank you so much!

Oh, and how do I hide it in the mobile browser? Thanks!!!!!!!!!!
I am not sure how you could make the "last logged in" bit shift over.

You need to repeat the HTML code you have dropped in between the if and else statement with different settings for the margin-top, to allow for the different heights for logged in or not. Search the rest of this forum and you will find better explanations of it's use.

Don't know sorry.
24knews.com - We live on the edge of chaos.
User avatar
Dankees
Registered User
Posts: 246
Joined: Sun Jan 25, 2015 2:27 am

Re: [DEV] Sidebar

Post by Dankees »

Cool, I got it to work with being logged in and not logged in. Thanks.

I guess I can mess with that "LAST LOGGED IN" code.

Or, perhaps, I could move that to the bottom of the forum?

Where do I move the code with this? YOU_LAST_VISIT

I think that's best, otherwise, there will be a big gap toward the top. So, I want to move it to the bottom somewhere. Do you know what code I want to move and where I can put it? Thank you!!!

What about the part about hiding it from the mobile browser? It totally messes it up on there.
User avatar
Pixel8r
Registered User
Posts: 177
Joined: Mon Nov 30, 2009 4:39 pm
Contact:

Re: [DEV] Sidebar

Post by Pixel8r »

cece74 wrote:Sorry guys. I put the download of the first version. There are too many variables and too many ozioni to follow for a conversion of a mod for 3.0.13 that adds nothing. For now abandon the project.
Thats a big shame I would really like to see this sidebar extension become a release. Hopefully someone else will take it up.

Thanks for the work you have done so far.
24knews.com - We live on the edge of chaos.
User avatar
cece74
Registered User
Posts: 498
Joined: Mon Jan 12, 2015 8:55 pm

Re: [DEV] Sidebar

Post by cece74 »

This will continue, but not now. I am busy with other EXT.
User avatar
Pixel8r
Registered User
Posts: 177
Joined: Mon Nov 30, 2009 4:39 pm
Contact:

Re: [DEV] Sidebar

Post by Pixel8r »

cece74 wrote:This will continue, but not now. I am busy with other EXT.
Great thanks will keep an eye on this thread.
24knews.com - We live on the edge of chaos.
User avatar
Dankees
Registered User
Posts: 246
Joined: Sun Jan 25, 2015 2:27 am

Re: [DEV] Sidebar

Post by Dankees »

I changed the height, but the length of the Twitter box isn't getting larger...?

Code: Select all

<div class="forabg" style="margin-top:47px;" height: 1011px;>
Dankees wrote:This code that you posted changes the height of the Twitter feed, where? I want to move that first sidebar box down, so it's in line with the forums, and I want to move the date and time back on the right where they belong.

What does that 846px do?
Pixel8r wrote:This is the code I had in my sidebar.html for the twitter bit. You will notice the height adjustment;

Code: Select all

<div class="forabg" height: 846px;>
        <div class="inner"><span class="corners-top"><span></span></span>
        <ul class="topiclist">
            <li class="header">
                <dl class="icon">
                    <dt>Tweets</dt>
                </dl>
            </li>
        </ul>
        <ul class="topiclist forums" style="padding: 0.05cm">
<div align="center">
<a class="twitter-timeline" href="https://twitter.com/24kFeed/lists/the-24knews-feed" data-widget-id="344735649628307457" data-chrome="noheader" height="846">Tweets from https://twitter.com/24kFeed/lists/the-24knews-feed</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
        </div>
        </ul>
        <span class="corners-bottom"><span></span></span></div>
        </div>
User avatar
Pixel8r
Registered User
Posts: 177
Joined: Mon Nov 30, 2009 4:39 pm
Contact:

Re: [DEV] Sidebar

Post by Pixel8r »

Note the bit in the twitter feed code that has been changed as well.

Code: Select all

<a class="twitter-timeline" href="https://twitter.com/24kFeed/lists/the-24knews-feed" data-widget-id="344735649628307457" data-chrome="noheader" height="846">
Dankees wrote:I changed the height, but the length of the Twitter box isn't getting larger...?

Code: Select all

<div class="forabg" style="margin-top:47px;" height: 1011px;>
24knews.com - We live on the edge of chaos.
User avatar
Dankees
Registered User
Posts: 246
Joined: Sun Jan 25, 2015 2:27 am

Re: [DEV] Sidebar

Post by Dankees »

Very cool! That worked. Now, we have to be able to hide it in the mobile browser because it makes the whole forum all messed up in the mobile browser.

Check out mine on your phone: http://www.LITeachers.com

And, what do you suggest I can do to move the "LAST VISIT WAS:" code to the bottom of the forum? I can't find the code that places that in the overall_header (unless it's in another page)...?
Locked

Return to “Abandoned Extensions”