I need to know how I can reduce the height difference between the home page modules .There is too much white space between the modules on the home page .

I also find the graphics in the modules gets truncated when displayed on a PC monitor.They dont get truncated when viewed on a mobile.

The links to the screenshots are here :
https://drive.google.com/open?id=1fIrk-v25G1b8eFAWmARuwEe6zqW9neDS

Thanking you in advance

    6 days later

    Hi
    Can you check again now ? The screenshots are available in the link now

    I also have another question related to Insight template .

    Question : Activating "Offline " in Global Seetings is not placing the Insight website/template in offline mode.
    I am using Regular labs " cache Cleaner " but even after deleting the cache(s) , the site is not going into offline mode.

    I am wondering whether there is anything wrong with the template's offline.php file.

    Thank you

      jamarrett
      Hi
      Kindly open template folder /css/custom.css file and add this code to change padding

      .t3-section.padding-bottom {
    padding-bottom: 160px;
}
.t3-section.padding-top {
    padding-top: 160px;
}

      Reduce the padding value as low as you want.

      For the images. use this code in custom.css file

      .acm-features.style-3 .features-image img {
    position: absolute;
    top: initial;
    left: initial;
    transform: initial;
    -webkit-transform: initial;
    min-width: 100%;
    min-height: 100%;
    width: 100%;
    max-width: none;
}

      Clear Joomla cache to see changes.

      Your site is in offline mode, it maybe due to any other cache applied on your site.

      Regards

        7 days later

        Hi

        I dont have a custom.css file so I have to create one , insert the code you gave me and place it in
        asiapacis.com/templates/ja_insight/css folder ?

        I did that and the padding for the top has been solved.

        I also requested in the previous post for the the padding above the heading " 15+ years of experience ......" and the module above to be reduced. Please help me with the code.

        Finally, the code you gave me for ensuring that the images appear in desktop mode is not working.it still truncates the images.

        Please revert.Thank you

          jamarrett
          Hi
          I checked you already added custom.css file and the code is also working.
          If you want to reduce more padding, you need to reduce the padding value from 100px to lower for top and 160px to a lower value for bottom padding.

          Clear your browser and Joomla cache to see the changes on frontend.

          Regards

            The images are still truncated. The padding problem is sorted out.
            If the truncation problem cannot be solved , then inform me so that I can look at alternatives.

            I thought it could be a problem with the cache ( cleaned the cache a few times).Waited for a day too to see if the images are still truncated. I have even checked the site with other browsers ( Edge etc )

            I am very upset.

              jamarrett
              Hi
              I checked the site again and noticed the code is modified in custom.css for image.
              I changed it again and also disabled JCH plugin so it loads the file correctly.
              Here is proof screenshot how it look like : http://prntscr.com/lu9nq6

                Ok the problem seems to be solved.
                But JCH has definitely improved performance.

                This is the settings page of JCH which may have caused the problem ( " image wrap " ) etc

                https://drive.google.com/file/d/1lHOCLL4PVzAWaI82j0-5qD6l6a33T2aM/view?usp=sharing

                Isn't it wiser to disable an option in JCH which is causing the problem than disabling JCH totally ?
                I dont seem to have problems on other sites where I use non Joomlart templates.

                Thanks in advance

                  jamarrett
                  Hi
                  You can turn it ON after clear JCH cache and completing customization in CSS.

                  Regards

                    jamarrett Kindly re-check as the above link to screenshot is inaccessible

                      jamarrett Kindly check now. Have added this to custom.css file :

                      @media only screen and (min-device-width: 320px) and (max-device-width: 480px) {.acm-features.style-3 .features-content{padding-bottom:0 !important;padding-top:0 !important;}}

                        No it's still the same Will delete totally the installation and perform a new install and then see whether the problem persists.

                          jamarrett Hi

                          Will look forward to hear back from you as you have the specific module shown on the site in order to review further

                            I have decided to disable the 2 modules that have been giving me the problem. Instead, I have activated the Heo module .So far , there is no problem.

                            So , will revert if there are any other issues.

                            Hi



                            As mentioned before, I have disabled the "troubling" modules and so far the Hero module is not giving any trouble ( crossing my fingers )


                            I am finalizing this template for this project and need some css changes:




                            1. Change the blue and gold in the original template ( Screen 1 )


                              I used Theme Magic to start a new theme called " Corby " and changed the blue in the template to # 1B2855.


                              However, it does not appear as # 1B2855 in the site.It appears as #232254


                              Could the css be changed to enabled it to be # 1B2855 for the blue and # C1A97D for the gold .


                              I can change the hex in the css later if need be .

                              https://drive.google.com/file/d/1-eXd_M92XCabzhPVWQe04wsOT15oybqG/view?usp=sharing

                            2. Main menu change to # 1B2855 in css ( Screen 2 )

                            https://drive.google.com/file/d/1hERuXqQVFw49h0PJ25nBfVfPW5YhaGvU/view?usp=sharing


                            1. Main heading bolden by 15 % ( screen 3 )

                            https://drive.google.com/file/d/1bJzCS-7CWRVwPfxt32GbFjZsbn9_u4u6/view?usp=sharing


                            4.Padding between lines of text to be reduced by 15% in Css ( Screen 4 )
                            and I can further adjust in css if need be.I had changed the fonts in Corby theme to Open Sans.


                            https://drive.google.com/file/d/1QUWZNWUBnS0PLuAiAGuLAwa3Farip0xA/view?usp=sharing

                             
  5.Subheadings changed to gold ( # C1A97D )  and bolden by 25 % .( Screen 5 )
https://drive.google.com/file/d/1FvkPcDdLqyBhnkf6v3RW7sAjV42EPsyl/view?usp=sharing

Thanks in advance

                            jamarrett

                            Hi,

                            If you're working on customizing as new theme, it's better to work with LESS file in template: http://www.t3-framework.org/documentation/bs3-customization#theme-customization

                            For now, you can take a backup of your site first, then go to Backend > Extensions > Templates > JA Insight > General tab > and enable the option Development Mode (then your site will load LESS files)

                            Let me know when you backup, then I will suggest you further changes.

                            Regards

                              You need to Login to view replies.