Support » Plugin: Page scroll to id » Using with button shortcodes

  • Resolved AP CO

    (@andrewprinsen)


    Great plugin!

    There are some shortcodes in my theme to make buttons, and when I try to add the rel=”m_PageScroll2id” it doesn’t make the smooth scroll happen. Do you have any idea how I would make this work with the buttons? Do I need to add a class somewhere in the plugin settings? You can see the button that does not work but the link that does at the top of this page:
    http://akros.com/test-page-3/

    Thank you!

    https://wordpress.org/plugins/page-scroll-to-id/

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author malihu

    (@malihu)

    Yes, it seems that your theme’s shortcode adds the m_PageScroll2id value as a class (instead of rel attribute).

    This is no problem because you can add your own selectors in ‘Selector(s)’ field in plugin settings.

    Just change:
    a[rel='m_PageScroll2id']
    to:
    a[rel='m_PageScroll2id'],a.btn.m_PageScroll2id

    The above tells the plugin to handle links with rel value ‘m_PageScroll2id’ (default) and links with class btn and m_PageScroll2id.

    Each selector is separated by comma (,) and you can add more if needed.
    You could even skip m_PageScroll2id in your shortcodes and add a selector like this:
    a.btn[href*='#']

    AP CO

    (@andrewprinsen)

    Hey, that worked like a charm, Malihu! Thanks for a great plugin!

    Plugin Author malihu

    (@malihu)

    No problem, glad I helped 🙂

    AP CO

    (@andrewprinsen)

    Hi malihu, another question. I’m trying to get the smooth scrolling to work with an image map I put together. The code for the image map is as follows:

    <img id="Image-Maps-Com-image-maps-2015-01-08-155814" src="http://www.image-maps.com/m/private/39601/41140-mSpray-500.png" border="0" width="500" height="250" orgWidth="500" orgHeight="250" usemap="#image-maps-2015-01-08-155814" alt="" />
    <map name="image-maps-2015-01-08-155814" id="ImageMapsCom-image-maps-2015-01-08-155814">
    <area shape="rect" coords="498,248,500,250" alt="Image Map" style="outline:none;" title="Image Map" href="http://www.image-maps.com/index.php?aff=mapped_users_39601" />
    <area  alt="" title="Enumerate" href="#enumerate" rel="m_PageScroll2id" shape="poly" coords="247,122,277,11,6,2,136,148" style="outline:none;" target="_self"     />
    <area  alt="" title="Target" href="#target" shape="poly" coords="256,122,286,13,469,81,339,202" style="outline:none;" target="_self"     />
    <area  alt="" title="Spray" href="#spray" shape="poly" coords="250,131,328,212,236,242,60,217,139,158" style="outline:none;" target="_self"     />
    </map>

    I tried adding the

    rel='m_PageScroll2id'

    inside my link so that it looked like

    <area alt="" title="Spray" href="#spray" shape="poly" rel="m_PageScroll2id"

    but that didn’t work. Should I instead be adding another selector in the plugin settings to make your smooth scroll work with this image map?

    Thank you again!

    Plugin Author malihu

    (@malihu)

    I’m not sure if it’ll work but try adding the selector:
    area[rel='m_PageScroll2id']

    AP CO

    (@andrewprinsen)

    That totally worked! Thank you again, malihu.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Using with button shortcodes’ is closed to new replies.