Add support for Theme upload

[aayushdutt]

Due to the Ephimeral file system of Heroku, currently the admin panel doesn't support uploading the themes directly. If uploaded, the theme would go missing after some time. The only way to use custom theme currently is to commit your themes in the code files and then re publish the application.
It would be good if we could add support for theme upload directly via the admin panel.

[SNathJr]

Yes, you are absolutely right about the theme uploading issue. If you need to use this feature, I would recommend using AWS S3 as your file storage while building the application. I am still working on a viable way to enable theme uploads for free. If you have any service in mind, do share. Thank you.

[aayushdutt]

Integrating Cloud Storage could be a good option.

[SNathJr]

Thank you. It looks promising. I will test it's integration with heroku in near future.

[aayushdutt]

Are you sure that in case of S3/Cloud Storage, the uploaded theme will not be stored in the file system?
I guess S3 integration docs says it only serves the images

[SNathJr]

@aayushdutt My bad, I just verified that it does not support themes upload. I am looking into the Ghost-Storage-Base repository to make a storage adapter with themes storage enabled.

[codechair]

Voting for this enhancement 👍🏼

[SNathJr]

@codechair I still have not found a viable solution to this. Things either require paid subscriptions or do not support files other than static images.
However, I will still be looking for other solutions (also considering to create a custom driver that syncs from remote on restart - such as a github private repo dump. But unless otherwise motivated, this will take time.)

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[xjose97x]

Things either require paid subscriptions or do not support files other than static images.

S3 supports any file types. Not only images.

[SNathJr]

Hey @xjose97x S3 does support all file types, however it requires you to have a paid AWS subscription, which many do not have.

S3 adapter of Ghost however does not seem to have support for storing themes on to S3, it just puts them in local storage.

[BadBrahmin]

Is this issue also the reason my gatsby + netlify deployment shows the default theme while my Heroku deployment shows the active theme?

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[dwanderton]

+1

[jerinjacob1999]

You can clone a theme in local and edit as needed, push it to GitHub, and change the theme URL on the package.json file to your GitHub theme repo. Finally, deploy on Heroku.

"casper": "github:jerinjacob1999/Casper",

[stephenajulu]

Great support @SNathJr
Good job for this.
I am using your button to build a ghost headless cms gatsby powered site.
Working on it now.

[vyronarediano]

"uploading the themes directly. If uploaded, the theme would go missing after some time. "

I also encountered this. Does anyone know how to solve this? Is there any workaround for this?

Thanks in advance.

[jerinjacob1999]

You can clone a theme in local and edit as needed, push it to GitHub, and change the theme URL on the package.json file to your GitHub theme repo. Finally, deploy on Heroku.

"casper": "github:jerinjacob1999/Casper",

@vyronarediano

[vyronarediano]

Hello @aayushdutt,

What should be the value of my theme?

and as you said "Clone it and copy your theme in content/themes" - Is this in zip file format? or the extracted one? because upon uploading it in content/themes there were no changes to push.
Only when I edit the package.json and copytheme.sh.

Many thanks in advance.

[aayushdutt]

@vyronarediano You should copy the extracted contents inside contents/themes. No other change is needed. If your new theme is named 'Editor', the folder should look like content/themes/Editor/...

[vyronarediano]

@vyronarediano You should copy the extracted contents inside contents/themes. No other change is needed. If your new theme is named 'Editor', the folder should look like content/themes/Editor/...

Alright, I see @aayushdutt. But by the way, when I did this, there were no changes to push in my git application.

Also, what would be the value of the theme in package.json (see screenshot above)?

Thanks

[aayushdutt]

As I said, no other change is needed. You don't need to change package.json at all. Just copy your theme and you are good to go.

[vyronarediano]

As I said, no other change is needed. You don't need to change package.json at all. Just copy your theme and you are good to go.

One last thing, what would be the value of the theme in package.json?

github:[username]/[name of the theme]?

[aayushdutt]

As I said, no other change is needed. You don't need to change package.json at all. Just copy your theme and you are good to go.

One last thing, what would be the value of the theme in package.json?

You don't need to change it. Just let it be what it is currently.
You will be able to see your new theme in the Ghost Admin panel

[vyronarediano]

As I said, no other change is needed. You don't need to change package.json at all. Just copy your theme and you are good to go.

One last thing, what would be the value of the theme in package.json?

You don't need to change it. Just let it be what it is currently.
You will be able to see your new theme in the Ghost Admin panel

Alright. Thank you so much for your help! Really appreciate it :)

[vyronarediano]

u should copy the extracted contents inside contents/themes. No other change is needed. If your new theme is named 'Editor', the folder should look like content/themes/Editor/...

Hello @aayushdutt, I just copied the theme and made the folder look like the one you said but there were no changes to commit and push.

[jerinjacob1999]

@vyronarediano there will not be, becuase new folders, has to add manually, if you are using heroku free quota , I don't personally recommend this method,do thing as I told before check my website.
https://cybergenie.tech

[aayushdutt]

@vyronarediano
Oh, sorry my bad. I forgot to mention you need to remove content/themes/* from .gitignore.

ghost-on-heroku/.gitignore

Line 9 in 842970d

content/themes/*

[aayushdutt]

@vyronarediano there will not be, becuase new folders, has to add manually, if you are using heroku free quota , I don't personally recommend this method

@jerinjacob1999 could you please explain a bit more. I am sorry I couldn't get what you mean.

[vyronarediano]

@vyronarediano
Oh, sorry my bad. I forgot to mention you need to remove content/themes/* from .gitignore.

ghost-on-heroku/.gitignore

Line 9 in 842970d

content/themes/*

Thank you @aayushdutt! Now I'm worried about the Theme might get stolen because it is a public repo.

[aayushdutt]

@vyronarediano If you need to make your repo private, instead of forking this repository, do the following

1. Create a private repository
2. Clone this repository
3. Update remote URL: git remote set-url origin <remote-url>
4. Proceed as normal in the next steps

Now your changes will be pushed to your private repository.

[vyronarediano]

@vyronarediano If you need to make your repo private, instead of forking this repository, do the following

1. Create a private repository
2. Clone this repository
3. Update remote URL: git remote set-url origin <remote-url>
4. Proceed as normal in the next steps

Now your changes will be pushed to your private repository.

Awesome. Thank you @aayushdutt for being helpful!

[noelldev]

To use a new theme:

1. Fork this repository
2. Clone it and copy your theme in content/themes
3. Remove content/themes/* from .gitignore
4. Push the change
5. Deploy

In case you wish to update existing deployment, follow updating-source-code instead of step 4
I think this should work @vyronarediano

@aayushdutt, Thanks for sharing if I do this by just upgrading the version of my theme and redeploy how about my previous changes, will it be save or will go back to the bare state of site. Thanks!!!

[aayushdutt]

@kodrr All your data should be safe in the MySQL database. You don't need to worry about that.

[noelldev]

@kodrr All your data should be safe in the MySQL database. You don't need to worry about that.

@aayushdutt, Actually I just did a theme ver update by just editing package.json then pushing directly to heroku w/o cloning the theme itself to the content folder it seems this is more efficient for me. Thanks, Cheers!!!

[aayushdutt]

@kodrr yeah that is the best method for using and updating open source themes

[kasindhu]

Hello @aayushdutt,

What should be the value of my theme?

and as you said "Clone it and copy your theme in content/themes" - Is this in zip file format? or the extracted one? because upon uploading it in content/themes there were no changes to push.
Only when I edit the package.json and copytheme.sh.

Many thanks in advance.

Sorry this is my doing.That theme is not public. I have removed accordingly from fork. Please contact the author for theme.

[kasindhu]

Even after adding s3 storage backend, the only files uploaded are images. The theme is not uploaded to the S3 bucket.

[rista404]

I managed to upload my theme with these steps:

heroku git:clone -a your-app
cd your-app
git remote add origin https://github.com/SNathJr/ghost-on-heroku
git pull origin master
# extract zip file of your theme inside `content/themes` dir
# remove content/themes from .gitignore
git commit -am "Add theme"
git push heroku master # deploys the theme

[boxedpaul]

Thanks for all your help. I have had problems with the themes before and these instructions helped. Now I need to add some redirects via redirects.json. I'm expecting I'll have the same problems.

Do you have any suggestions for how to fix this? Happy to open another issue if it's not similar enough.

[hegioncom]

I managed to upload my theme with these steps:

heroku git:clone -a your-app
cd your-app
git remote add origin https://github.com/SNathJr/ghost-on-heroku
git pull origin master
# extract zip file of your theme inside `content/themes` dir
# remove content/themes from .gitignore
git commit -am "Add theme"
git push heroku master # deploys the theme

Great summary. I do have a question though:

Question 1: I've followed your step, but the new theme is still not reflected when i return to my dashboard

Here's what I did:

cd <my-local-directory-folder>
heroku git:clone -a <my-heroku-app-name>
cd <my-heroku-app-name>
git remote add origin https://github.com/SNathJr/ghost-on-heroku
git pull origin master
# I've extracted zip file of my theme inside `content/themes` dir 
cat .gitignore
git rm -r --cached content/themes 
# I've performed the 2 steps above to remove content/themes from .gitignore
git commit -m 'Remove newly ignored directory "content/themes"'
git push origin master
git commit -am "Add <my-heroku-app-name> theme"
git push heroku master 
# tried to deploy the theme

But after checking my dashboard, my theme is still not appearing.

Anyone there to help? thanks!