0
Welcome Guest! Login
0 items Join Now

SmoothScroll atom - Freebie by MrT

    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    SmoothScroll atom - Freebie by MrT

    Posted 5 years 4 months ago
    • Some of you have followed my previous SmoothScroll atom tutorial https://rockettheme.com/forum/gantry5-for-joomla/249639-smooth-scrolling-creating-your-first-atom-revised .

      Here is an updated version of the atom that adds a few more configurable options including the ability to specify an offset for the scrolling and whether the hash link should be set in your browser address bar. Please note that the smooth scrolling will only work for links within the same page that start with "#".

      1. To install it:

      Joomla:
      From the ZIP file copy smoothscroll.yaml and smoothscroll.html.twig to /templates/TEMPLATENAME/custom/particles (note you may need to create this folder).
      GRAV
      From the ZIP file copy smoothscroll.yaml and smoothscroll.html.twig to /user/data/gantry5/themes/TEMPLATENAME/particles (note you may need to create this folder).
      Wordpress
      From the ZIP file copy smoothscroll.yaml and smoothscroll.html.twig to /wp-content/themes/TEMPLATENAME/custom/particles (note you may need to create this folder).


      2. On you base outline > page settings - drag the smooth scroll atom on to the atom section. Then click on the "settings" cog and change your setting to meet your requirements and SAVE;

      Regards, Mark.
    • Last Edit: 1 year 6 months ago by MrT.
    • The following users have thanked you: Rick Ghaly, sklar, Michael Vaughan, Zbigniew Sokal, kobinas, Bigfly

    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • kobinas's Avatar
    • kobinas
    • Newbie
    • Posts: 12
    • Thanks: 0

    Re: SmoothScroll atom - Freebie by MrT

    Posted 2 years 7 months ago
    • Hello MrT i create one page site where i want to add menu with anchor to scroll down smooth.
      First i add the 2 files and create the particles folder but you dont mention if we have to do anything else to apear in Gantry.
      Second if we manage to add it and work fine, the link for the menu is #the_section_i_want_to_go. In Gantry5 the name of the posision is the section or no and how i can find it.
      Sorry for the English.
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: SmoothScroll atom - Freebie by MrT

    Posted 2 years 7 months ago
    • See step 2 to actually use it.

      You can use an inspector tool to find the ID that we have assigned to section but also you can create your own CSS ID on any section or particle on the layout of your outline.

      Regards, Mark.
    • The following users have thanked you: kobinas

    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • kobinas's Avatar
    • kobinas
    • Newbie
    • Posts: 12
    • Thanks: 0

    Re: SmoothScroll atom - Freebie by MrT

    Posted 2 years 7 months ago
    • not sur if i did anything wrong but i did it and still nothing
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: SmoothScroll atom - Freebie by MrT

    Posted 2 years 7 months ago
    • Please would you post your URL, superuser id and pswd in the secure tab of your post and I'll have a look for you.

      Also, Please post your FTP logon, password and FTP URL in the secure area of your post.

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • kobinas's Avatar
    • kobinas
    • Newbie
    • Posts: 12
    • Thanks: 0

    Re: SmoothScroll atom - Freebie by MrT

    Posted 2 years 7 months ago
    • This message contains only secure information that is visible to MrT, moderators and administrators
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: SmoothScroll atom - Freebie by MrT

    Posted 2 years 7 months ago
    • Ok, so where's your link that you want to click on to scroll to the new position in the page?

      Please do a screenshot of your problem and annotate to make it clear.

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • kobinas's Avatar
    • kobinas
    • Newbie
    • Posts: 12
    • Thanks: 0

    Re: SmoothScroll atom - Freebie by MrT

    Posted 2 years 7 months ago
    • i dont have created yet. i want to make 3 menus to scroll me down to home page
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: SmoothScroll atom - Freebie by MrT

    Posted 2 years 7 months ago
    • Well, nothing is going to happen until you create the links.


      I just created three menu item links for you using the IDs that I added to the "heading" particles on the layout of your outline. Now the smooth scrolling works.

      Regards, Mark.
    • The following users have thanked you: kobinas

    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • kobinas's Avatar
    • kobinas
    • Newbie
    • Posts: 12
    • Thanks: 0

    Re: SmoothScroll atom - Freebie by MrT

    Posted 2 years 7 months ago
    • thank you very much MrT. Helpful as always

Time to create page: 0.058 seconds