How do you save a Png for web under 300kb

Try Saving for Web (Legacy)...

Optimize images for PNG-24 in Photoshop Elements

Check your file (the one with the bad shadows) in a browser rather than Photoshop. I don't know why, but photoshop shows the compressed png with a hard shadow, but when opened in a browser they look fine.

One thing to understand about Photoshop's (old) Save For Web function is that it is quite abysmal for proper PNG optimization - especially so for ones which require alpha transparency (for example, a semi-transparent drop shadow). This is a fact - it is that bad. Avoid.

For example, the SFW function does not even allow for indexed transparency - which is the primary method to reduce the file size. However, it depends on the original image whether a reduction to 256 colours will retain the original's visual quality.

The newer export option is not that much better.

Things can be improved by utilizing a number of techniques in Photoshop:

https://www.smashingmagazine.com/2009/07/clever-png-optimization-techniques/

https://www.smashingmagazine.com/2009/07/png-optimization-guide-more-clever-techniques/

However, these techniques generally take too much time in a production environment, and I prefer to export the image as a 32bit full quality transparent PNG, and then use third-party tools to squeeze the last bytes out of my files before upload.

The by far most brilliant tool for PNG optimization (without having to spend to learn command line tools such as these: Best Command Line PNG Tools) is ColorQuantizer. And it is, amazingly enough, FREE!

http://x128.ho.ua/color-quantizer.html

Nothing else can touch it. Unfortunately only available for Windows, but it works under WINE for both Linux and Mac. For Mac users reasonable alternatives are ImagOptim and ImageAlpha.

https://imageoptim.com/

https://pngmini.com/

The powers of ColorQuantizer are many. One excellent feature I will mention here: a quality brush which allows the user to brush over small coloured areas which must be retained during optimization. It's brilliant. It is also the only tool I am aware of that allows for reduction to ANY number of colours if required.

If you wish to stay working within Photoshop, and not depend on external tools, a viable option is PngHat:

Source | PNG Hat

SuperPNG might also be helpful: SuperPNG

Other vendors (like TinyPNG) produce similar plugins, but I really cannot see why anyone would pay for a simple plugin with functionality that can be had for free. At least PngHat offers some neat time-saving features aside from quite good PNG compression.

But as soon as I open one it Photoshop and check the image size it jumps in size, and I haven't been able to save anything under 1mb. Please help!!

Where are you reading the file size in Photoshop?

http://creativepro.com/know-your-photoshop-file-sizes/‌

As Theresa suggests, what is the size on disk in Explorer/Finder?

You don't need to open the file in PS to check the size. What does the file size say when you look at in the Finder or Explorer? Are you using the Save for Web option to export the png?