Community ändern

alle Meetups

Rendered Items:

<sy-stream base="https://community.gemeinsamerleben.com" community="friendseek|bergsport" show-local-position-filter="true"></sy-stream>

Attribute

additional-link-parameters
base
community
custom-stream-data
hide-show-more
hide-wall-posts
page-size
show-filter
default-filter
show-local-position-filter
local-position-filter-text
show-description
lat
lng
radius

Events

window.addEventListener('syStreamInit', function (e) {
 console.log('total items: ', e.detail);
});
window.addEventListener('syStreamFiltered', function (e) {
 console.log('items filtered: ', e.detail);
});
window.addEventListener('syStreamError', function (e) {
 console.log('Error: ', e.detail);
});
window.addEventListener('syStreamNotSupported', function (e) {
 console.log('browser not supportet', e.detail);
});
window.addEventListener('syOnImageClick', function (e) {
 e.detail.event.preventDefault();
 console.log('handle image click', e.detail.images, e.detail.activeIndex);
});

Styling

sy-stream{
 --sy-primary-color: #15b0e8;
 --sy-widget-font-size: 15px;
 --sy-widget-line-height: 1.5;
 --sy-widget-title-font-size: 20px;
 --sy-widget-font-weight: 500;
 --sy-widget-title-line-height: 30px;
 --sy-widget-font-family: 'Open Sans', sans-serif;
 --sy-widget-heading-font-family: 'Raleway',sans-serif;
}

<sy-gallery tags="hiking|lake" other-tags="" row-count="3" show-navigation="true"></sy-gallery>

Attribute

tags
other-tags
row-count
show-navigation
lat
lng
radius
image-count
cta-link
cta-text
image-mobile-height
image-desktop-height


Events

window.addEventListener('syGalleryInit', function (e) {
 console.log('total items: ', e.detail);
});
window.addEventListener('syGalleryItemClicked', function (e) {
 console.log('item details: ', e.detail);
});
window.addEventListener('syGalleryError', function (e) {
 console.log('Error: ', e.detail);
});


Styling

sy-gallery{
 --sy-primary-color: #15b0e8;
 --sy-widget-navigation-background: #15b0e8;
 --sy-widget-gallery-cta-background: #15b0e8;
 --sy-widget-gallery-cta-background: #fff; }

<sy-new-users community="marken-demo" base="https://club.superfly.fm" with-picture="true" link-target="_blank" ></sy-new-users>

Attribute

community
base
with-picture
rounded-picture
maxitems-per-row
max-items-per-row-desktop
max-image-width
max-items
centered

Events

window.addEventListener('syNewUsersInit', function (e) {
 console.log('total items: ', e.detail);
});
window.addEventListener('syNewUsersError', function (e) {
 console.log('Error: ', e.detail);
});


Styling

sy-new-users{
 --sy-primary-color: #15b0e8;
}

<sy-stream></sy-stream>

Events

document.addEventListener("DOMContentLoaded", function () {
 document.getElementById('customStream').customStreamData = {
  stories: '20547|DA7FE81F:6059',
  events: 'ahXLQdc7EBa|RzLbWhYwaKZ|SJME19Juu2Z|EQLC5xpa9AX',
  groups: 'bXVh9FjEBJV',
  meetups: 'DG9p7PruGJi',
  random: true
 };
});

<sy-user-search></sy-user-search>

<sy-user-search base="https://mamis.online" heading="Finde Mamis in deiner Umgebung!" subheading="Hole dir Inspiration, lerne Leute kennen und erlebt Fotografie gemeinsam!" button="Jetzt mitmachen" community="mamis-unter-sich"></sy-user-search>

Attribute

Events

syUserSearchInit
syUserSearchError

Style

#user-widget-2{ --sy-primary-color: #71AEB6; }

<sy-user-search-results gender="FEMALE" community="friendseek"></sy-user-search-results>

Attribute

gender
ageMin
ageMax
interest
count

Events

syUserSearchResultsInit
syUserSearchResultsError

<sy-interested-users tag="dogs|cats" community="tierfreunde" max-items="6"></sy-interested-users>

Attribute

base
link-to
additional-link-parameters
community
tag
interest
max-items
row-css
lat
lng
radius

Events

syInterestedUsersInit
syInterestedUsersError

Diskussion ändern

<sy-forum-button identifier="824" base="https://friendseek.com" css-class="btn" show-participants="true"></sy-forum-button>

Attribute

base
identifier
link-target
css-class
show-participants
show-max-participants


Events

syForumButtonInit
syForumButtonError

Don't wrap users (scrollbar)

.sy-forum-participants{
  flex-wrap: nowrap;
}

<sy-forum-content identifier="824" base="https://friendseek.com"></sy-forum-content>

Attribute

base
identifier
show-last-reply


Events

syForumContentInit
syForumContentError

<sy-card type="WALL" item-id="23378"></sy-card>
<sy-card type="WALL" item-id="74686"></sy-card>

<sy-card type="WALL" item-id="28869" meetup-id="jnhsZB393Ep"></sy-card>

<sy-card type="GROUP" item-id="563133EE"></sy-card>

<sy-card type="MEETUP" item-id="cTEsnRReUsR"></sy-card>

<sy-card type="EVENT" item-id="4UNs3toczHR"></sy-card>

<location-filter></location-filter>

Events

syLocationInit
syLocationSet
syLocationUnset


<sy-users></sy-users>

Attribute

lat
lng
radius


Events

syUsersInit
syUsersError


<sy-meetups></sy-meetups>

Attribute

lat
lng
radius


Events

syMeetupsInit
syMeetupssError


<sy-events region="" community="wandern-bergsteigen" ></sy-events>

Attribute

community
region


Events

syEventsInit
syEventsError


Loading dimension


Loading width

<loading-spinner text="Lade Daten ..."/>

Attribute

text

Styling

loading-spinner{
 --sy-widget-loading-spinner-dimension: 50px
 --sy-widget-loading-spinner-item-width: 4px;
}