Templates and Projects support > Php templates

New Moon Phase Images for WB2_2b

(1/5) > >>

Andy9164:
Hi everyone,

I have created some detailed moon images for use on WB2_2b template. It may work on others but I have only tested it on the above but if you know how to adjust those templates then they could work for you. It will ONLY work on php templates. There are 200+ images which show the moon in every visible percentage and it uses the $moonphase and $MoonPercentAbs to select the correct image so you get a very accurate view of the visible moon.

I have uploaded a demo to www.midlifedad.me.uk/WB2_moons although this image wont change or you can see the idea fully working / changing version on my website at www.midlifedad.me.uk/weather

To install is very simple. Download the attached zip folder, unzip and place the unzipped "moon" folder which contains the images in your style folder. (There should already be a folder in there called "forecast".)

Then using a text editor edit the index.php file in your main directory as follows:

Look for this piece of code:

div class="pan night" style="margin-bottom:5px;">
                  <h2><?php echo $Tr_moonphase; ?></h2>
                  <img src="images/moon.bmp" style="padding: 50px 0px 52px 120px" alt="Forecast icon" title="Forecast icon" />
                  <p style="text-align:center">Phase : <strong><?php echo $moonphase; ?></strong><br />
                  <?php echo $Tr_MoonPercent; ?> <strong><?php echo $MoonPercentAbs; ?>%</strong></p>
               </div>

Change the line in red above to the following:

<img src="style/moon/<?php echo $moonphase. ' ' .$MoonPercentAbs; ?>.png" style="padding: 33px 0px 25px 50px" />

Any questions or problems then reply back in the forum.

I will soon be posting a second set of images which are "cartoon like" but work on the same principle.

Hope you enjoy.

Andy

Andy9164:
Adding a second set of moon images.

Follow instructions above to use making sure the unzipped folder is renamed to moon.

If you have already uploaded and are using the first set then I suggest you rename your style/moon folder to style/old_moon and then unzip the attached file, rename the folder to moon and upload into your style folder.

These images are 110px x 110px if you need a smaller version then let me know what size and I can use a batch file in Photoshop to make them smaller quite easily. Not too many requests though  ;)

If you do use a smaller size then you will need to adjust the "padding" in the above code to get them to work.

Looking at other Weather By You templates that use php I think they will work in the same way although the images will need to be made smaller and the "padding" changed to get things looking nice. Happy to help if you need it.

Comments and questions welcome.

Andy

Steve Bannister:
Hi Andy,

Long time, no speak! I hope you're well and keeping safe.

I came across your Moon files, but the link doesn't work anymore. Do you still have a set? I'm also interested in how you got your Beaufort images to work.

Hopefully, you see this.

Steve

Andy9164:
Hi Steve,
Keeping well thanks hope you and everyone here is as well.

I still heve a set of moons, in fact I have several as I modified some and found a new way of creating the shading so am happy to post them if you need them. However.....

If you are using CmulusMX then that now has the ability to create a daily moon image, very similar to mine and I actually use that on my website now rather than holding 200+ images. If you need help with that take a look in the CumulusMX forum or give me a shout here. By all means, if you need my images let me know and I will attach them.

As for the Beaufort, it works on the same principle as the original moon. I have 13 images named 0,1,2...12 in a folder located at style/beaufort and then on the index.php page you would need to add some code similar to the moon code. This is from my page just to give you an idea.

<div class="picture beaufort" style="margin-bottom:25px;">
                  <h5 style="padding-top:38px;">Currently : Force <strong><?php echo $beaufortnumber; ?></strong><br>
                  <?php echo $beaudesc; ?> </h5>
                  <img src="../style/beaufort/<?php echo $beaufortnumber; ?>.png" alt="" style="padding: 10px 0px 0px 75px" />

Hope that helps

Andy

Steve Bannister:
Hi Andy,

Thanks for the code, I really appreciate it. This is what I ended up with;

               <div class="pan beaufort">
                  <h2><?php echo $Tr_beaufort; ?></h2>
                  <img src="style/beaufort/<?php echo $beaufortnumber; ?>.png" alt="" style="padding: 20px 0px 10px 0px" />
                  <p style="text-align:center">Currently : Force <?php echo $beaufortnumber; ?><br>
                  <?php echo $beaudesc; ?> </p>
               </div>

I'd love a copy of the Moon files, please. I have found a set but there are 361 of them from 0 to 360. Great files, but Cumulus 1 seems to work best with 200 using the negative numbers for waning and <#MoonPercent>

I guess I'll see when you send them, but I assume they go from 0 (new) to 100 (full) then -100 to -1 (new again)?

I'm back in the UK now, teaching at a school in Bedfordshire. I've just got the PTA to buy us a weather station, so I'm doing it all again. Just a little bit more full-on this time.

Steve

Navigation

[0] Message Index

[#] Next page