Contao Member Extension Bundle

Adds a listing of members with detail pages and extends them with an avatar that can be uploaded and deleted

Oveleon


--- > Working with **Contao 4.13** (PHP ^8.0) --- The Member extension bunde adds the possibility to display members and their details in lists using frontend modules. The member options are extended with an avatar that can be changed and uploaded in the member edit module and registration module. Additionally, you can display members with their details in a reader page. + [Features](#features) + [Installation](#installation) + [Upgrading (v.1.1 to >=v.1.2)](#upgrading-to-version--12) + [Composer](#via-composer) + [Contao Manager](#via-contao-manager) + [Initial Setup](#initial-setup) + [Insert tags](#insert-tags) + [Avatar insert tags](#avatar-insert-tags) + [Front end modules](#front-end-modules) + [Memberlist](#memberlist) + [Memberreader](#memberreader) + [Avatar / Profile picture](#avatar--profile-picture) + [Delete avatar](#delete-avatar) + [Support](#support) + [Sponsoring](#sponsoring) ## Features - Compatible with Contao 4.13 (PHP ^8.0) - Extends members with avatars - Paginated member lists - Member detail pages - Insert tags for member avatars --- ## Installation #### Upgrading to version >=1.2 > After upgrading from version 1.1 to version >=1.2, make sure to edit your modules (memberlist, memberreader and avatar/profile picture) and set up the new templates. #### Via composer ``` composer require oveleon/contao-member-extension-bundle ``` #### Via contao-manager ``` Search for contao member extension bundle and add it to your extensions. ``` After installing the contao-member-extension-bundle, you need to run a **contao install**. --- ## Initial setup This bundle extends contao with the possibiity to extend members with an avatar and displaying members in a list with detail pages. 1. Go into members and set up a default avatar in the newly added settings ![Admin View: Member overview](https://www.oveleon.de/share/github-assets/contao-member-extension-bundle/default_avatar.jpg) ![Admin View: Member settings](https://www.oveleon.de/share/github-assets/contao-member-extension-bundle/default_avatar_setup.jpg) 2. To display your members, you need to set up a memberlist 1. Create the front end module *memberlist* 2. Choose the member groups and the member fields that should be displayed 3. Optionally you can set up a redirect page to your memberreader 4. Embed the module in a page ![Admin View: Memberlist](https://www.oveleon.de/share/github-assets/contao-member-extension-bundle/module_memberlist.jpg) 3. Displaying the avatar 1. Create the front end module *Avatar / profile picture* 2. Optionally you can set an image size 3. Embed the module in a page ![Admin View: MemberAvatar](https://www.oveleon.de/share/github-assets/contao-member-extension-bundle/module_memberavatar.jpg) 4. Module to delete an avatar 1. Create the front end module *Delete Avatar* 2. Embed the module in a page 3. The module only appears if a frontend user is logged in 4. You can check the "profile picture option" within registration to enable members to upload a profile picture within registration ![Admin View: MemberDeleteAvatar](https://www.oveleon.de/share/github-assets/contao-member-extension-bundle/module_memberdeleteavatar.jpg) 6. Member reader page 1. Create the front end module *memberreader* 2. Choose the member groups and the member fields that are allowed --- ## Insert tags Member avatars can be shown using following *insert-tags* > For more information on *Insert tags*, please visit the official Contao documentation. **Example** ``` {{avatar::member::current}} {{avatar::member::current::200x200xproportional}} {{avatar::member::4}} {{avatar::member::4::300x300xcrop}} // Output file url {{avatar_url::member::current}} {{avatar_url::member:4}} ``` The allowed image size parameters are: "width x height x mode" Size mode (See: [Size Array](https://docs.contao.org/dev/framework/image-processing/image-sizes/#size-array)) - crop - proportional - box The standard mode vor avatar insert tags is *crop* ### Avatar insert tags
Member extension avatar
Insert tag Description
{{avatar::member::current}} Displays the avatar of the logged in member
{{avatar::member::current::200x300}} Displays the avatar of the logged in member with a width of 200 and a height of 300
{{avatar::member::current::300x400xbox}} Displays the avatar of the logged in member with a width of 300, a height of 400 and the mode: box
{{avatar::member::123}} Displays the avatar of member id 123
{{avatar::member::123::200x300}} Displays the avatar of member id 123 with a width of 200 and a height of 300
{{avatar::member::123::300x400xbox}} Displays the avatar of member id 123 with a width of 300, a height of 400 and the mode: box
--- ## Front end modules ### Memberlist Displays activated members in a list ### Memberreader Displays a detail page of a member ### Avatar / Profile picture Displays an avatar of a member. If no avatar has been uploaded, the default avatar (or the fallback avatar from the bundle) will be shown ### Delete Avatar A module that can be embedded into a page that adds the possibility to delete the avatar of a member. --- ## Support > We **only provide support** for **bugs, and feature requests**; please only post issues about these two topics. > > If you need help implementing Contao Member Extension Bundle or you are just starting out > with Contao/CSS or HTML, please contact us on our [website](https://www.oveleon.de/kontakt.html#kontaktformular), > visit the [Contao Community](https://community.contao.org/) > or the [Contao Slack](https://join.slack.com/t/contao/shared_invite/enQtNjUzMjY4MDU0ODM3LWVjYWMzODVkZjM5NjdlNDRiZjk2OTI3OWVkMmQ1YjA0MTQ3YTljMjFjODkwYTllN2NkMDcxMThiNzMzZjZlOGU), > you will be able to find more help there. > > This will help us to keep the issues related to this plugin and solve them faster. --- ## Sponsoring If you find this plugin useful, please consider [sponsoring us](https://github.com/sponsors/oveleon) to help contribute to our time invested and to further development of this and other open source projects. Thank you for your support! - [Oveleon](https://www.oveleon.de).