Position of accept/settings buttons

  • Resolved aleksandreeu

    (@aleksandreeu)


    2 years, 8 months ago

    Hi is it possible to locate button for accept/reject/set up cookies on the right side under each other (in the desktop version)?
    I mean to have buttons next to the text, as you can see here: https://ibb.co/2tnhPQ3

    And in the mobile version as it is right now, horizontally under each other.

    In the previous threads I did not get the answer.

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Contributor Aert Hulsebos

    (@aahulsebos)

    Hi @aleksandreeu,

    In the previous thread I mentioned creating an article for this purpose, where I will describe the CSS.

    I will post it here tomorrow,
    regards Aert

    Plugin Contributor Aert Hulsebos

    (@aahulsebos)

    Hi @aleksandreeu,

    https://ementor.us3.instawp.xyz/

    Start in Cookie Banner settings with Banner Bottom and Template Accept/Deny, then add some CSS:

    @media (min-width: 1024px) {
.cmplz-cookiebanner.cmplz-categories-type-view-preferences .cmplz-buttons, .cmplz-cookiebanner.cmplz-categories-type-no .cmplz-buttons {
    flex-direction: column!important;
}
.cmplz-cookiebanner {
    width: calc(40% - 20px);
    position: absolute;
    left: 50%;
    top: 50%;
    bottom: unset;
    transform: translate(-50%, -50%);
}
.cmplz-cookiebanner .cmplz-header {
    display:flex;
}
}
    Thread Starter aleksandreeu

    (@aleksandreeu)

    Can you please send screenshot where to paste it? Bcs for me it did not work.

    Plugin Contributor jarnovos

    (@jarnovos)

    Hi @aleksandreeu ,

    Could you copy the CSS to Appearance > Customize > Additional CSS?

    For good measure, please also Clear/purge cache in any active caching & optimization plugins.

    Kind regards,
    Jarno

    Thread Starter aleksandreeu

    (@aleksandreeu)

    Hmm, I did it, but CSS does not work for me at all.

    Plugin Contributor jarnovos

    (@jarnovos)

    Hi @aleksandreeu,

    I made a slight change to the above CSS, could you try the steps below? (you can remove the previous implementation).

    Navigate to Complianz > Cookie Banner, enable the “Use Custom CSS” option, set the Position to “Bottom”. and the Categories to “Accept/Deny”.

    In the Custom CSS field on the bottom of the page, copy and paste the below CSS and Save.

    @media (min-width: 1024px) {
.cmplz-cookiebanner.cmplz-categories-type-view-preferences .cmplz-buttons, .cmplz-cookiebanner.cmplz-categories-type-no .cmplz-buttons {
    flex-direction: column!important;
}
.cmplz-cookiebanner {
    width: calc(40% - 20px);
    left: 50%;
    top: 50%;
    bottom: unset;
    transform: translate(-50%, -50%);
}
.cmplz-cookiebanner .cmplz-header {
    display:flex;
}

    Hope it helps!
    Kind regards,
    Jarno

    Thread Starter aleksandreeu

    (@aleksandreeu)

    Does not work for me ??

    Look what I got:
    https://ibb.co/7Qcm6zy
    https://ibb.co/z4Txvb2

    Plugin Author Rogier Lankhorst

    (@rogierlankhorst)

    Do you have the banner set to banner bottom?
    This works fine for me.

    Maybe you need to add some width as well. It needs to be adjusted depending on your specific requirements.

    .cmplz-cookiebanner {
    width:750px!important;
}
.cmplz-cookiebanner .cmplz-body{
    width:440px;
}
    Thread Starter aleksandreeu

    (@aleksandreeu)

    Yes, now it works.
    Can you please recommend also, if I can somehow replace button decline (cookes) with Setting up cookies?

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Position of accept/settings buttons’ is closed to new replies.