How to add new 'hosts' in MAMP PRO?

I am working on several Kirby websites, locally, on my Mac.

I have being using MAMP (the non PRO version) to be able to view one site in a browser (URL http://localhost:8888)

I have just bought MAMP PRO to be able to set up multiple websites/servers/hosts so that I can see more than one of the local websites in a browser, without forever having to change the MAMP settings.

Setting up the ‘localhost’ is easy. I simply choose the Document Root of one of the websites.

But, when I add a ‘Host’, name it and choose the Document Root of another website, then click ‘open’ I get the following message in the browser:

Safari can’t find the server. Safari can’t open the page “https://www.lastveneer:8888” because Safari can’t find the server “www.lastveneer”. (lastveneer was the name I gave it)

=====

So, the next thing I’ve tried is to create a new folder (on my Desktop) in MAMP PRO and copy across the website files. The browser now displays the homepage, but no images and other pages just get an error message:

Not Found

The requested URL was not found on this server.

How do I set it up?

The url looks somehow wrong, when you named the host lastveneer, you should open it at http://lastveneer or http://lastveneer:8088, if you are still using the default ports (I usually use 80/443 so as not to have to add the port in the Url). https will only work if you enabled it.

And you have to save and restart the server after creating a host.

Still not working. Here’s my new settings.

In MAMP PRO when I click “Open” I still get the same error message in the browser: Safari can’t find the server. Safari can’t open the page “https://www.veneer:8888” because Safari can’t find the server “www.veneer”.

I don’t know what a port is, so I guess it is the default.

My htaccess is written in a way to turn on https when live, but turn off when testing locally:

RewriteCond %{HTTP_HOST} !^localhost(?::\d+)?$ [NC]
RewriteCond %{HTTP_HOST} !^www. [NC,OR]
RewriteCond %{HTTPS} !on
RewriteCond %{HTTP_HOST} ^(?:www.)?(.+)$ [NC]
RewriteRule ^ https://www.%1%{REQUEST_URI} [R=301,L,NE]

I’ve tried MAMP PRO both with the SSL button ticked and not ticked. Neither works.

I’ve also opened my browser and typed in http://veneer and http://veneer:8088 in the address field and get the same error message as when I click ‘Open’ in MAMP PRO.

Well, obviously your .htaccess file does not work as expected, because it automatically redirects to https and www, this cannot possibly work. So for starters, please comment those lines.

Then, with these lines commented, enter the right url again manually in the browser, exactly as defined, ie. with a capital V (or better still, rename it to veneer).

Keep in mind that this is a Kirby support forum, not MAMP, please.

BTW: If you put your projects into a folder, lets say User\yourname\sites and then point localhost to this folder, your projects inside this sites will be available via localhost/folder-name (in case you want to quickly open a project without creating a host).

BTW: If you put your projects into a folder, lets say User\yourname\sites and then point localhost to this folder, your projects inside this sites will be available via localhost/folder-name (in case you want to quickly open a project without creating a host).

That sounds very interesting. It’s basically what I want. So I have a folder on my hard drive called “backups2022”. Inside this folder is about 10 other folders containing backups of varies iterations of my Kirby website.

I’ve pointed the localhost to “backups2022” and saved it. But when I go to my browser and type in localhost/backups2022 I get the following error message:

Safari can’t connect to the server. Safari can’t open the page “localhost/backups2022” because Safari can’t connect to the server “localhost”.

Any ideas?

I’ve also tried typing in http://localhost:8888 directly into the browser address field, but get same error message

I localhost points to backups2022, then you open that folder with http:localhost:8888. but if there is no index.html or index.php in that folder, it won’t do anything useful.

But: You open a folder my-folder inside this backups2022 folder with http://localhost:8888/my-folder.

1 Like

Thank you so much, that is brilliant! I can now view different options and iterations side by side. This is going to make a big difference to my workflow.

For any other newbies who stumble on to this thread, this is how I think it works:

Kirby uses PHP. If you are building a website on your computer (called ‘local’) then the website will not display in a browser. PHP websites only work / display when they are on a server. To get around this, there are apps like MAMP that make a ‘server’ of a folder on your computer. The PHP Kirby website(s) within this folder can then be viewed in a local browser.

It is possible to have more than one website within the folder. To view additional websites type http://localhost:8888/my-folder into the address field in the browser. Where my-folder is the name of the folder containing that particular website.

Okay, http://localhost:8888/my-folder allows me to see all the websites within my backups2022 folder, but, any images added by the CSS are not displaying.

For example:

.hero-image {
background-image: url(“/home/wave.jpg”);
}

Is not displaying. Is this something to do with absolute and relative links? Any ideas?

Secondly, I’ve finally managed to set up a second host for an entirely different website. But the fonts, served by Fontstand are not displaying. Fontstand say’s about their web fonts: “The development domains are automatically recognised: localhost, 127.0.0.1, 0.0.0:3000.” The fonts display as they should when the site is on the localhost. So it appears because this additional host is called “host-1” the fonts will not work. Any ideas how I can get them to work?

From a lot of research I think

background-image: url(“/home/wave.jpg”);

is an absolute link?

I presume this is not working because an absolute link starts at the beginning (is this called the root?). So in this case it is trying to find a folder called ‘home’ on the localhost. And of course the ‘home’ folder doesn’t live there.

I believe this is a relative link. Relative to the where the CSS file lives:

background-image: url(“…/content/home/tide.jpg”);

so the ../takes us out of the ‘assets’ folder, then into the ‘contents’ folder, then into the ‘home’ folder.

But this doesn’t work.

But this works. I don’t know why - isn’t this skipping the ‘content’ folder?

background-image: url(“…/home/wave.jpg”);

If I use relative links, to images, within my CSS file, are there issues I should be aware of? I presume relative links work when I make the site live?

You should put images you want to use in your stylesheets into the assets folder, not into your content, where these files could accidentally be deleted by users (and because the content folder is blocked by .htaccess, or should be).

You should put images you want to use in your stylesheets into the assets folder, not into your content, where these files could accidentally be deleted by users

Makes sense.

(and because the content folder is blocked by .htaccess , or should be).

I’ve had images in the content folder, linked to in the stylesheet, for months, and they have displayed. Apart from turning on https and www I haven’t touched the .htaccess file. You might want to look into the default Kirby htaccess file.

Hi Texnixe

Thanks for all your help (again)! I think I’ve got things working. Thanks for the tip about putting projects into a folder, so that they are all available via localhost. This is going to be a massive help. Previously I wasn’t able to view older iterations or different designs/versions.

Thanks again

I know that file pretty well.

This line from the .htaccess

RewriteRule ^content/(.*) index.php [L]

is supposed to block direct access to the content file.

That line is in my .htaccess file. Yet my site’s stylesheet accesses a file in the content folder.

Ok, right, because that url without content redirects to the media folder, had forgotten about that.

Top left of the screen, you can toggle between the two views.

Screenshot 2023-01-30 at 3.55.37 PM

Pick the second one and go into expert view.
In the new sidebar you’ll see a voice called “Ports & Users”
In there there’s this option:

I remember having a similar issue using tha native MAMP ports so the 8888 and setting the ports using that option solved the issue for me.

1 Like