Webwide | Web Designer, Developer and Maker Community | Now Live!

Status
Not open for further replies.
Thank you! I don't think the OG images would work as an add-on because it is an entirely different script that I have running on a separate VPS (the resource usage is a little spikey!) and just connecting with the API. That being said, happy to help anyone get something similar designed & set-up for small fee. 😊

If you did not want to run a VPS for it, I could make it work using any screenshot API. If you have less than 1,000 threads a month, you could use this one for $7/m: https://apiflash.com/. If you have less than 100 it would be free.
 
BT10 said:
@adamgreenough I see. How difficult is it in term of setting up and maintenance, even with your help involved?
Click to expand...
Just updated that post, sorry! If you used a screenshot API there would be no maintenance. I just cheaped out and rolled my own on an existing server.

If you did not want to run a VPS for it, I could make it work using any screenshot API. If you have less than 1,000 threads a month, you could use this one for $7/m: https://apiflash.com/. If you have less than 100 it would be free. There might be cheaper API's out there I could find also.
 
adamgreenough said:
Thanks @Starbucks! They're just widgets using the custom HTML block.
Click to expand...
Oh wow! This might not be the right place to ask for a short tutorial, but would you be open to give a quick explanation (whether it is here or in a private conversation) how this works? I'm trying this now for several days and I just can't figure it out! I already checked some threads here but I can't get it to work by adding the code in the right style's extra.less 😫
 
Sure! Here is the HTML in my custom widget...
HTML: 
<div class="feature-widget widget-new-post">
    <h3>What's on your mind?</h3>
    <p>Get help, show off your work, write an article, share a link or just have a chat throughout our wide variety of forums.</p>
    <a href="https://webwide.io/forums/-/post-thread" data-xf-click="overlay" class="widget-button"><i class="far fa-edit"></i> Create post</a>
</div>
...and my CSS in extra.less...
Less: 
// Home widgets
.feature-widget {
    color: #fff;
    padding: 18px;
    border-radius: 4px;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
    
    &:before {
        content: '';
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        width: 100%;
        height: 200%;
        position: absolute;
        right: -30%;
        top: -50%;
        opacity: 0.3;
        pointer-events: none;
        z-index: 0;
    }
    
    h3 {
        margin: 0;
        line-height: 1.1;
        z-index: 1;
        position: relative;
    }
    
    p {
        font-size: 13px;
        color: rgba(255, 255, 255, 0.85);
        margin: 5px 0 9px;
        z-index: 1;
        position: relative;
        line-height: 1.3;
        
        a {
            color: #fff;
        }
    }
    
    a.widget-button {
        padding: 8px 15px;
        color: #fff;
        font-weight: bold;
        background: rgba(0,0,0,0.1);
        border-radius: 4px;
        z-index: 1;
        position: relative;
        display: inline-block;
        transition: 0.25s;
        font-size: 14px;
        
        &:hover {
            background: rgba(0,0,0,0.2);
            text-decoration: none;
        }
        
        i {
            opacity: 0.8;
            margin-right: 4px;
        }
    }
    
    &.widget-new-post {
        background: #236FD2;

        &:before {
            background-image: url('[removed]');
        }
    }
}
 
adamgreenough said:
Sure! Here is the HTML in my custom widget...
HTML: 
<div class="feature-widget widget-new-post">
    <h3>What's on your mind?</h3>
    <p>Get help, show off your work, write an article, share a link or just have a chat throughout our wide variety of forums.</p>
    <a href="https://webwide.io/forums/-/post-thread" data-xf-click="overlay" class="widget-button"><i class="far fa-edit"></i> Create post</a>
</div>
...and my CSS in extra.less...
Less: 
// Home widgets
.feature-widget {
    color: #fff;
    padding: 18px;
    border-radius: 4px;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
   
    &:before {
        content: '';
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        width: 100%;
        height: 200%;
        position: absolute;
        right: -30%;
        top: -50%;
        opacity: 0.3;
        pointer-events: none;
        z-index: 0;
    }
   
    h3 {
        margin: 0;
        line-height: 1.1;
        z-index: 1;
        position: relative;
    }
   
    p {
        font-size: 13px;
        color: rgba(255, 255, 255, 0.85);
        margin: 5px 0 9px;
        z-index: 1;
        position: relative;
        line-height: 1.3;
       
        a {
            color: #fff;
        }
    }
   
    a.widget-button {
        padding: 8px 15px;
        color: #fff;
        font-weight: bold;
        background: rgba(0,0,0,0.1);
        border-radius: 4px;
        z-index: 1;
        position: relative;
        display: inline-block;
        transition: 0.25s;
        font-size: 14px;
       
        &:hover {
            background: rgba(0,0,0,0.2);
            text-decoration: none;
        }
       
        i {
            opacity: 0.8;
            margin-right: 4px;
        }
    }
   
    &.widget-new-post {
        background: #236FD2;

        &:before {
            background-image: url('[removed]');
        }
    }
}
Click to expand...
Omg, you're amazing! Thank you so much!!
I didn't expect the whole code! This really helped me out a lot!
 
adamgreenough said:
Some stats from our first 10 days:

👀 Served 13,596 unique visitors
🖋 Received 1,489 posts...
💬 ...in 224 discussions...
👋 ...by 566 members from all around the world
🧡 Hit the front-page of Hacker News
😻 Been featured on Product Hunt (#4 of the day)
Click to expand...
yes, it's a success!
It's an interesting site, thanks. I'll take a look, but however, I don't like the design itself
 
Unfortunately made the decision to close the Webwide forums this week. Maintained a trickle of activity but as a designer & developer with very high front-end standards there were several pain points that just sucked the excitement out of me to push forwards with XenForo without a huge overhaul.

Most crucially the poor post typesetting (https://xenforo.com/community/threa...s-bug-fixing-styling-seo.183853/#post-1450546), little markdown support (https://xenforo.com/community/threads/is-it-possible-to-add-missing-markdown-headings.185467/) and the abysmal Froala post editor experience on iOS (https://xenforo.com/community/threads/major-editor-complaints.171300/page-2#posts). There's also the lack of iOS notifications but appreciate this is out of XF's hands.

What I would consider major issues in this day and age had no sign of interest from XF in improving them and am surprised many more forum owners do not kick up a fuss considering the user experience, SEO and accessibility benefits which are surely things that forums need to be excelling at to compete with alternative platforms.

There's also the looming UK online safeguarding stuff that I expect will pass in some form and I'm not interested in being responsible for every word from every user!

I'm in the process of moving the community to a paid membership only Discord channel. Now that they have threads, nice per-server user profiles, unlimited message storage and bots with every command and feature you can think of on fast native apps it does seem like a sensible move that my audience will enjoy more.
 
Last edited:
Another forum sunseted and moving to Discord. Are you migrating all of your XF content to Discord or starting fresh?
 
l3ta said:
Another forum sunseted and moving to Discord. Are you migrating all of your XF content to Discord or starting fresh?
Click to expand...
A fresh, I am not sure there is a way to migrate content in to Discord as it is quite different. It was a toss-up between Discord and a self-hosted Discourse installation (confusing similar names!) but it seems like many people in my niche have a Discord server or two anyway that they use so probably an easier sell to move over the community than another website.

I think I will keep a static archive of the forums live at least temporarily to still provide the value in the threads as well as a nice bit of SEO juice. The site receives several thousand hits a month from search engine queries.
 
adamgreenough said:
A fresh, I am not sure there is a way to migrate content in to Discord as it is quite different. It was a toss-up between Discord and a self-hosted Discourse installation (confusing similar names!) but it seems like many people in my niche have a Discord server or two anyway that they use so probably an easier sell to move over the community than another website.

I think I will keep a static archive of the forums live at least temporarily to still provide the value in the threads as well as a nice bit of SEO juice. The site receives several thousand hits a month from search engine queries.
Click to expand...
Well, good luck in your future endeavours, Adam. You are a talented individual with leadership skills. I'm sure you'll do fine. :)
 
l3ta said:
Well, good luck in your future endeavours, Adam. You are a talented individual with leadership skills. I'm sure you'll do fine. :)
Click to expand...
Thank you @l3ta! And you. Thanks for joining me for the ride. I will still be lurking here quietly awaiting the killer features that lure me back in, I am trying to focus less on platform and more on community so always going to keep that fluid. :)
 
Status
Not open for further replies.
Back
Top Bottom