177 lines
No EOL
5.8 KiB
Markdown
177 lines
No EOL
5.8 KiB
Markdown
# CSS Page Weaver
|
|
|
|
|
|
|
|
CSS Page Weaver is a browser-based publishing tool, made up of [PagedJs](https://pagedjs.org/about/) library and modulars additionals features. While it's design to ease installation for beginners CSS Page Weaver also bring elegant and extendable solution for more advanced users.
|
|
|
|
## ✨ Features
|
|
|
|
- **Streamlined and Ready-to-Use**: Get started quickly with a standardized way to integrate features.
|
|
- **Extensive Plugin Library**: No need to reinvent the wheel with the available plugins.
|
|
- **WYSIWYG Editor**: Streamline your design pratice with an extandable interface.
|
|
- **Create and Share Plugins**: Develop and share your own plugins easily.
|
|
|
|
## ⛵ Getting Started
|
|
|
|
### Prerequisites
|
|
|
|
- A local web server
|
|
|
|
### 🪴 Installation (fastest way)
|
|
|
|
If you feel a bit lost with following instruction, you should probably look at the [CSS Page Weaver compiled with a few plugins](https://gitlab.com/csspageweaver/csspageweaver/-/releases)
|
|
|
|
Integrate it at the root level of your page and add a link to `csspageweaver` main _module_ into your HTML template
|
|
|
|
```html
|
|
<script src="/csspageweaver/main.js" type="module"></script>
|
|
```
|
|
|
|
*Do you need to also install PagedJs? Nope! CSS Page Weaver already embed it.*
|
|
|
|
### Use
|
|
|
|
Run a simple server. That's it!
|
|
|
|
### Boilerplate
|
|
|
|
Don't have a project to test it? There is [a ready-to-use boilerplate](https://gitlab.com/csspageweaver//boilerplate). Download, unzip & run a server!
|
|
|
|
|
|
## 🚀 Going further
|
|
|
|
### 🌲 Installation (complete way)
|
|
|
|
Released version on CSS Page Weaver is compiled with few plugins. You can install the package yourself for greater control.
|
|
|
|
#### Clone CSS Page Weaver repo in your project [option A].
|
|
|
|
```bash
|
|
# With HTTPS
|
|
git clone https://gitlab.com/csspageweaver/csspageweaver.git
|
|
|
|
# With SSH
|
|
git clone git@gitlab.com:csspageweaver/csspageweaver.git
|
|
```
|
|
#### Clone CSS Page Weaver as a git subtree [option B].
|
|
|
|
Subtree are great to:
|
|
- embed CSS Page Weaver repo in another repo
|
|
- get updates
|
|
|
|
```bash
|
|
git subtree add --prefix csspageweaver/ git@gitlab.com:csspageweaver/cssPageWeaver.git --squash
|
|
```
|
|
|
|
### 🔌 Dependencies
|
|
|
|
CSS Page Weaver is designed to work with plugins. In this complete installation, you need to install plugins by yourself. If you've downloaded [the last release of CSS Page Weaver](https://gitlab.com/csspageweaver/csspageweaver/-/releases), few plugins are already embedded.
|
|
|
|
**Here is a [list of all plugins](https://gitlab.com/csspageweaver//plugins) known.**
|
|
|
|
**Steps**
|
|
|
|
1. Download and place plugin folder in `csspageweaver/plugins`
|
|
2. Add plugin to manifest
|
|
|
|
#### Installation as subtree
|
|
|
|
We prefer to install plugins using Git Subtree because it allows us to easily preserve the filiation link with the plugin directory (and to obtain updates!).
|
|
|
|
Bear in mind, if you're not comfortable with command lines, that *step 1* can easily be replaced by a simple *download, drag and drop*.
|
|
|
|
Otherwise, here is how it works.
|
|
|
|
##### (Step 1) Clone plugin as a subtree
|
|
|
|
Install plugin as a submodule of `csspageweaver`
|
|
|
|
```bash
|
|
git subtree add --prefix="csspageweaver/plugins/{{PLUGIN_FOLDER_NAME}}" git@gitlab.com:csspageweaver/plugins/{{PLUGIN_NAME}}.git --squash
|
|
```
|
|
|
|
##### (Step 2) Add plugin to manifest
|
|
|
|
Almost done. Add a mention to `csspageweaver/manifest.json`
|
|
|
|
```json
|
|
{
|
|
"plugins": [
|
|
// existing plugin,
|
|
"PLUGIN_FOLDER_NAME"
|
|
],
|
|
}
|
|
```
|
|
|
|
Look at complete [plugins list](https://gitlab.com/csspageweaver/plugins) and [plugins installation guide](https://gitlab.com/csspageweaver/csspageweaver/-/wikis/design/plugins/install)
|
|
|
|
#### Update as subtree
|
|
|
|
This is where Git subtrees are wonderful
|
|
|
|
```bash
|
|
git subtree pull --prefix="csspageweaver/plugins/{{PLUGIN_NAME}}" main --squash
|
|
```
|
|
|
|
A bit dazed? Don't worry. Once again, you can update your plugins with your favorite *download, unzip, drag and drop* shady method.
|
|
|
|
### 🎁 Package manager
|
|
|
|
You already like the principle of subtrees, but you think (rightly) that the multiplication of command lines can be a bit tedious in the long run? Installation and dependencies can me handle with our [Package Manager](https://gitlab.com/csspageweaver/package-manager)
|
|
|
|
**Install CSS Page Weaver and plugins with package manager**
|
|
|
|
```bash
|
|
./weaver_manager.sh --install
|
|
```
|
|
|
|
**Get update with package manager**
|
|
|
|
```bash
|
|
./weaver_manager.sh --pull
|
|
```
|
|
|
|
See [Package Manager repository](https://gitlab.com/csspageweaver-toolkit/package_manager) and [further documentation on managing your installation](https://gitlab.com/csspageweaver/csspageweaver/-/wikis/maintain_and_develop/core/5-manage_csspageweaver_integration)
|
|
|
|
|
|
|
|
## 🔄 Customization
|
|
|
|
### Basic Information
|
|
|
|
Edit `csspageweaver/manifest.json` to declare:
|
|
- Plugins
|
|
- Plugins configuration
|
|
- Stylesheets
|
|
- Your custom hooks
|
|
|
|
### CSS Page Weaver behavior (advanced)
|
|
|
|
Edit `csspageweaver/main.js` to:
|
|
- disable Common dictionary
|
|
- disable Interface
|
|
- Choose render method
|
|
|
|
## 🎓 Documentation
|
|
|
|
A complete [documentation is available](https://gitlab.com/csspageweaver/csspageweaver/-/wikis/home)
|
|
|
|
## 📝 License
|
|
|
|
This project is licensed under the MIT License
|
|
|
|
## 👏 Acknowledgements
|
|
|
|
CSS Page Weaver is based on [PagedJs](https://pagedjs.org/about/) by Coko Foundation.
|
|
|
|
CSS Page Weaver is an original idea of Julie Blanc ehanced by Benjamin G.
|
|
Julien Taquet was a great help in reimagining the rendering module. Finally, Nicolas Taffin and Julien Bidoret helped to oversee this tool.
|
|
|
|
All CSS Page Weaver plugins remains linked to their original creators.
|
|
Without them, GUI would remain an empty shell. Thanks 🙏
|
|
|
|
## 🙌 Contributing
|
|
|
|
Features and documentation requests are welcome! Feel free to check the [issues page](https://gitlab.com/csspageweaver/csspageweaver/-/issues).
|
|
|
|
Contributions must follow our [code of conduct](https://www.contributor-covenant.org/version/2/1/code_of_conduct/) |