https://github.com/collective/volto-subsites

https://github.com/collective/volto-subsites

hacktoberfest

Last synced: 8 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/collective/volto-subsites
• Owner: collective
• Created: 2020-10-26T16:18:08.000Z (about 4 years ago)
• Default Branch: master
• Last Pushed: 2024-04-24T07:48:57.000Z (7 months ago)
• Last Synced: 2024-04-24T13:51:34.892Z (7 months ago)
• Topics: hacktoberfest
• Language: JavaScript
• Homepage:
• Size: 140 KB
• Stars: 1
• Watchers: 9
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

• awesome-volto - volto-subsites

README

        
# volto-subsites

Volto addon to manage subsites.  

Intended to be used with [collective.volto.subsites](https://github.com/collective/collective.volto.subsites/).

To be used with mrs-developer, see [Volto docs](https://docs.voltocms.com/addons/) for further usage informations.

Created with [voltocli](https://github.com/nzambello/voltocli).

## Usage

> If you're using Volto < 12, then use [v1.1.0](https://github.com/collective/volto-subsites/tree/v1.1.0)

>

> If you're using Volto < 16, then use [v3.0.4](https://github.com/collective/volto-subsites/tree/v3.0.4)

Simply load the addon in your project.

Put  wherever you want. This component loads the config for subsite and add subsite classes to body.

Suggest component where to put the subsite loader is the customized AppExtras component from volto.

Get subsite data from the redux state in your components. For example:

```js

import React from 'React';

import { connect } from 'react-redux';

import { SubsiteLoader } from 'volto-subsites';

const AppExtras = ({ pathname }) => {

  return (

    <>

      

    >

  );

};

export default connect(

  (state, props) => ({

    pathname: props.location?.pathname,

  }),

  {},

)(AppExtras);

```

```js

class Header extends Component {

  //...

  render() {

    return (

      <>

        //...

        {this.props.subsite?.title}

      >

    );

  }

}

export default connect(state => ({

  token: state.userSession.token,

  subsite: state.content?.data?.['@components']?.subsite;

}))(Header);

```