0
Welcome Guest! Login
0 items Join Now

ScaleText particle - Freebie by MrT

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

    ScaleText particle - Freebie by MrT

    Posted 5 years 2 months ago
    • Have you even wanted a heading or other text to always look the same regardless of the viewport size? Ever needed to have your text always fit the available width perfectly? Then perhaps by ScaleText particle might be of benefit to you...


      This image is hidden for guests.
      Please log in or register to see it.



      The particle is responsive and can occupy as much or little space you require on your layout. It always makes the text fit 100% of the available width by altering the size of the font. It can be used with any font and your text can be a single or multiple line.

      1. To install it:

      Joomla:
      From the ZIP file copy scaletext.yaml and scaletext.html.twig to /templates/TEMPLATENAME/custom/particles (note you may need to create this folder).
      From the ZIP file copy _scaletext.scss to /templates/TEMPLATENAME/custom/scss (note you may need to create this folder).
      In your custom.scss file (create one if you don't have one in /templates/TEMPLATENAME/custom/scss) add
      @import "dependencies";
      @import "scaletext";
      GRAV
      From the ZIP file copy scaletext.yaml and scaletext.html.twig to /user/data/gantry5/themes/TEMPLATENAME/particles (note you may need to create this folder).
      From the ZIP file copy _scaletext.scss to /user/data/gantry5/themes/TEMPLATENAME/scss (note you may need to create this folder).
      In your custom.scss file (create one if you don't have one in /user/data/gantry5/themes/TEMPLATENAME/scss) add
      @import "dependencies";
      @import "scaletext";
      Wordpress
      From the ZIP file copy scaletext.yaml and scaletext.html.twig to /wp-content/themes/TEMPLATENAME/custom/particles (note you may need to create this folder).
      From the ZIP file copy _scaletext.scss to /wp-content/themes/TEMPLATENAME/custom/scss (note you may need to create this folder).
      In your custom.scss file (create one if you don't have one in /wp-content/themes/TEMPLATENAME/custom/scss) add
      @import "dependencies";
      @import "scaletext";


      2. On your chosen outline > layout - drag the scaletext particle on to the layout. Then click on the "settings" cog and add your text items and SAVE .

      That's it.

      Enjoy!

      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.
    • pdowse's Avatar
    • pdowse
    • Hero Rocketeer
    • Posts: 292
    • Thanks: 31

    Re: ScaleText particle - Freebie by MrT

    Posted 5 years 1 month ago
    • Awesome - Going to have a play around with this.

      Thanks Mark.
    • The following users have thanked you: Zbigniew Sokal

    • Good things come to those who wait - but it's only what's left over from those who don't

Time to create page: 0.037 seconds