Grav – Theme Tutorial
In this chapter, let us create a Grav theme to understand the concept. Antimatter When you install the Grav base package, the default Antimatter theme is installed, which uses Nucleus (a simple base set…
In this chapter, let us create a Grav theme to understand the concept. Antimatter When you install the Grav base package, the default Antimatter theme is installed, which uses Nucleus (a simple base set…
Themes control the looks of your Grav site. Themes in Grav are built with the powerful Twig Templating engine. Content Pages and Twig Templates The pages that you create, references a…
Multi-Language is defined as the use of different languages in your website. We will learn different procedures that will help you use multi-languages in your Grav site. Multi β Languages…
Modular pages are difficult to understand at first but once you get to know about it, it would be very easy to work with. It enables to creation of a…
Description Using media queries in your attributes, you can use different widths on devices. In this process, you donβt have to create multiple images as they get created automatically. If your browser does…
Description Adding a suffix to the filename, we can add higher density images to the pages. If higher density images are provided, lower quality versions are generated. For example, [image-name]@[density-ratio]x.[image-extension]. Example…
Description The resize action will set width, height, data-width and data-height attributes to your <img> / <video> or <a> tag. In this way, your image will get displayed in the requested size.…
Description Sepia filter is added to give a vintage look. Example ![My New Image](/images/maxresdefault.jpg?cropZoom = 300, 200&sepia) Output The above code will generate the following output β Previous Page:-Click Here
Description Colorizes the image by adjusting red, green, and blue setting values from -255 to +255 for each color for the image. Example ![My New Image](/images/maxresdefault.jpg?cropZoom = 300, 200&colorize = 100, -100, 40) Output The above code will generate…
Description Edge finding filter is added to the image. Example ![My New Image](/images/maxresdefault.jpg?cropZoom = 300, 200&edge) Output The above code will generate the following output β Previous Page:-Click Here