The forum of the forums

Would you like to react to this message? Create an account in a few clicks or log in to continue.
The forum of the forums
2 posters

    Widgets position

    micho
    micho
    micho
    New Member


    Posts : 4
    Reputation : 1
    Language : english
    • Post n°1

    In progress Widgets position

    Post by micho October 1st 2020, 9:13 pm

    Technical Details


    Forum version : #phpBB2
    Position : Founder
    Concerned browser(s) : Google Chrome
    Who the problem concerns : All members
    When the problem appeared : All the time
    Forum link : ( link is hidden, you must reply to see )

    Description of problem

    Hi guys!

    I managed to put my widgets in a bootstrap sidebar and it works perfectly. My only struggle is that I would like to give my users the chance to decide if they want to have the sidebar opened or closed all the time. Now it closes every time the forum is refreshed.
    I've done some research and I found couple of solutions which were using cookies but as I am still pretty incompetent in java matter, I haven't succeed with any of them.

    Here is the java code of the menu:
    Code:
    $(document).ready(function(){$('.menuonclick').on('click',function(){$('.menuall, .menuonclick').toggleClass('opened')})});

    Any help would be much appreciated!

    Thanks a lot! Smile
    • Back to top
    levy
    levy
    levy
    Hyperactive


    Male Posts : 2631
    Reputation : 350
    Language : English, Romanian
    Location : Romania
    • Post n°2

    In progress Re: Widgets position

    Post by levy October 3rd 2020, 11:27 pm

    Hello @micho and Welcome to Forumotion Very Happy

    Can you show us the HTML to your widget if possible, I'd like to make some minor changes to it and if possible, can we have the forum adress as well? It might be easier to change them there.

    Also, I see that you use the .toggleClass which isn't needed and it might be the problem that you have. I'll leave a code below and some simple understanding of it.


    Code:
    $(document).ready(function() {
        $('#element').on('click', function(e) {
            $('.dropdown').toggle();
        });
    });

    now, to make this work, you can incorporate a simple ID for example
    Code:
    <a href="#" id="element">Press</a>
    and to make the class that we trigger as well. note that we will use a style as well for it, to make it hidden from first. I think it can be reversed as well, most of my toggles are from hidden to shown, not Shown to Hidden but I think it can work as well

    Code:

    <a href="#" id="element">Press</a>
    <div class="dropdown" style="display:none;">Text to be shown / hidden</div>

    If you have any questions, please let me know and I will try at my best to help

    skouliki and TonnyKamper like this post

    • Back to top
    micho
    micho
    micho
    New Member


    Posts : 4
    Reputation : 1
    Language : english
    • Post n°3

    In progress Re: Widgets position

    Post by micho October 4th 2020, 3:05 pm

    Hi @levy!

    Thank you very much for your time, kind reply and the warm welcoming.

    I've tested your code but it does the same as the one I posted in my previous post Very Happy If I click on Press, the sidebar with the widgets is appearing but when I refresh the forum it disappears again. Ergo the opened status of the sidebar is not remembered.

    The link of my forum is in the first post and please, find the HTML of my widgets below:
    Code:
    <body class="custhead header" background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}"
         vlink="{T_BODY_VLINK}"><div class="menuonclick">sidebar</div><div class="menuall"><div class="mcontents abiscroll">
                <div id="{ID_LEFT}">
                               <!-- BEGIN giefmod_index1 -->
                               {giefmod_index1.MODVAR}
                               <!-- BEGIN saut -->
                               <div style="height:{SPACE_ROW}px"></div>
                               <!-- END saut -->
                               <!-- END giefmod_index1 -->
                            </div>
                </div>
                </div>

    Thank you once again! Smile
    • Back to top
    micho
    micho
    micho
    New Member


    Posts : 4
    Reputation : 1
    Language : english
    • Post n°4

    In progress Re: Widgets position

    Post by micho October 10th 2020, 8:58 am

    Hey guys,

    I am still interested in the solution. I've done a bit more research and I found this code on the french support forum.
    Code:
    $(function() {
                      var c = $("#left,#right"), d, e = function(a) {
                        var a = a.direct ? 0 : 1E3, b = $(this).data("side");
                        window.localStorage && localStorage[("none" == $("#" + b).css("display") ? "remove" : "set") + "Item"]("wid" + b, "1");
                        $("#" + b).stop(!0, !0).animate({width:"toggle", height:"toggle", opacity:"toggle"}, a);
                        $(this).toggleClass("isopened isclosed")
                      };
                      c.length && ($("#content-container").prepend(d = $('<div id="widget-arrows"><div style="clear:both"></div></div>')), c.each(function() {
                        $(this).find("script").remove();
                        var a = $(this).attr("id"), b = $('<div class="widget-arrow is' + a + ' isopened"></div>');
                        "right" == a && $("#content").prepend($("#right").css("padding", "0 10px")).css("margin-right", 0);
                        b.data("side", a).appendTo(d).click(e);
                        window.localStorage && "1" == localStorage.getItem("wid" + a) && b.trigger({type:"click", direct:!0})
                      }))
                    });

    I think it's doing what I need - using the local storage to remember if the widgets are opened or closed. The only difference is that my widgets are on the left side, within the body and not the content-container, and I want them to be closed by default.
    Anyone can help me to add a "localstorage" part to my code? Smile
    • Back to top

      Current date/time is September 23rd 2024, 8:34 am