# FKB Pro - Social theme **URL:** https://meta.discourse.org/t/fkb-pro-social-theme/234323 **Category:** Theme **Created:** [July 28, 2022, 8:58pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323 "2022-07-28T20:58:41Z") **Posts on this page:** 20 **Page:** 1
### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don) #### Post date: [July 28, 2022, 8:58pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/1 "2022-07-28T20:58:42Z")
| | | | | --- | --- | --- | | šŸ‘“ | **Preview** | [Theme Creator](https://discourse.theme-creator.io/theme/Don/fkb-pro) | | šŸ›  | **Repository** | [FKB Pro theme](https://github.com/VaperinaDEV/fkb-pro-theme) | | ā¤ | **Found it useful?** | [\> ./support --coffee](https://meta.discourse.org/u/don) | | ā“ | **Install Guide** | [How to install a theme or theme component](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682) | | šŸ“– | **New to Discourse Themes?** | [Beginnerā€™s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) | **FKB Pro** is a highly modified, detailed, professional social theme, but still user-friendly. šŸš€ > āš  **This theme is quite sensitive and maybe not well compatible with other theme components or plugins you use!** Please test it before use. These usually need some css modification. If you have any issue please report and will fix it. * * * ## Layout **On desktop:** Three column layout. ![Screenshot 2023-01-02 at 19.53.05](https://global.discourse-cdn.com/meta/original/4X/5/4/3/543b344600b8fb6ae6dccc92c77cecc46646b004.jpeg) Sidebar ready ![Screenshot 2023-01-02 at 19.51.55](https://global.discourse-cdn.com/meta/original/4X/a/e/9/ae96c37c29d4d946ff2168e63b4b2383fee42ad3.jpeg) * * * **On mobile:** ![Screenshot 2023-01-02 at 19.56.45](https://global.discourse-cdn.com/meta/original/4X/c/b/1/cb101211f3558a64d8b19ff040c956930e5ac52f.png) ![Screenshot 2023-01-02 at 20.20.41](https://global.discourse-cdn.com/meta/original/4X/7/6/1/761917687f96e0e3abed63d770270c0f604ecace.png) * * * ### Rounded corners FKB Pro has highly rounded corners everywhere by default, but I know not everyone likes it so I added some Theme Settings to make it easier to customize it. ![Screenshot 2023-01-02 at 19.58.51](https://global.discourse-cdn.com/meta/original/4X/1/f/c/1fccacf5171aea5548d48c50a43b7e7a1702fdac.png) If you donā€™t like rounded cornersā€¦ set these value to `0`. ![Screenshot 2023-01-02 at 20.00.25](https://global.discourse-cdn.com/meta/original/4X/2/0/7/2075508e1fc874b289921f8f870f8fa450fb4387.jpeg) * * * ### Topic Card ![topic-list-card](https://global.discourse-cdn.com/meta/original/4X/6/f/4/6f46b983b5ac24004bd0c7c59c0613d6e2409957.jpeg) Main sections 1. **Title** _(click goes to the last post)_ 2. **Excerpt** _(click goes to the OP)_ 3. **Image** _(click goes to the last post)_ Other sections 1. **Left top** : Author datas (avatar, name, username) and the date when the topic created. _(click open user card)_ 2. **Right top** : Category badge 3. **Center bottom** : Tags 4. **Left bottom** : Topic likes and views _(click goes to OP and summarize topic if available)_ 5. **Right bottom** : Last poster avatar, date and replies count. _(click avatar open user card, date go to last post and replies count open reply selection)_ Badges style 1. bullet ![Screenshot 2022-07-28 at 13.20.14](https://global.discourse-cdn.com/meta/original/4X/6/c/d/6cdc5a7403117371168c27ef3daf7d9f7a2d938c.png) 2. bar ![Screenshot 2022-07-28 at 13.17.04](https://global.discourse-cdn.com/meta/original/4X/6/8/1/68116756d66aa507c89a51c0bacddadbcefc1767.png) 3. box ![Screenshot 2022-07-28 at 13.18.34](https://global.discourse-cdn.com/meta/original/4X/b/9/c/b9c3856761448819fa18792e068b87bc3aca51c8.png) * * * ### Category Page Because of the limited size on center please use, one column category page styles. I made some customization on these to fit more to this theme. **Categories Only, Categories and Latest Topics, Categories and Top Topics** ![Screenshot 2023-01-02 at 20.02.30](https://global.discourse-cdn.com/meta/original/4X/3/d/6/3d6c37cb89e561cbfde519599f0c2631b3f0dcab.png) **Categories Boxes** ![Screenshot 2023-01-02 at 20.07.37](https://global.discourse-cdn.com/meta/original/4X/0/a/2/0a23eb3924f520031dbe110c2c8cb9e74f1b6429.png) **OR** You can use the [Modern Category + Group Boxes](https://github.com/jordanvidrine/discourse-category-group-boxes.git) theme component created by @jordan.vidrine * * * ## FKB Panel **On desktop:** The right sidebar. **For anon visitors** it is show a Welcome message. This message is same as` js.signup_cta.value_prop`. The header `Welcome` text you can change in Theme Translation. ![Screenshot 2022-07-28 at 12.10.27](https://global.discourse-cdn.com/meta/original/4X/e/8/9/e89499d24c72dc1631bdb711bf842e210b0e9bf1.png) **OR** **For anon visitors** there is an option to enable a custom sidebar. You can add custom content to the sidebar like image and description. ![Screenshot 2022-07-31 at 14.47.37](https://global.discourse-cdn.com/meta/original/4X/c/a/6/ca621fe3ac598fe90abc69c3308401595ab925fa.png) ![Screenshot 2022-07-31 at 14.44.05](https://global.discourse-cdn.com/meta/original/4X/a/4/2/a42331de7028c5f81318ec4a660b3d916ca40d78.png) * * * **For logged in users** it is contains the user informations such as profile picture, statistics, badges and also use the user card image to background. Also contains some quick buttons on bottom. ![Screenshot 2022-07-28 at 12.58.34](https://global.discourse-cdn.com/meta/original/4X/1/9/9/1995c08ba14320f61760adb91b9b39fe5df0d9e7.png) * * * ## Color Schemes ![Screenshot 2023-01-02 at 20.10.14](https://global.discourse-cdn.com/meta/original/4X/7/d/8/7d890aedc66b78523545ab6b223aa94870ff4a65.jpeg) ![Screenshot 2023-01-02 at 20.12.55](https://global.discourse-cdn.com/meta/original/4X/b/3/b/b3bc25823b2149ac961ce2e4e5112ce555c9f582.jpeg) The theme contains two color schemes **FKB Pro - Light** and **FKB Pro - Dark**. > **Color Schemes** > > FKB Pro - Light > > - primary `#242526` > - secondary `#ffffff` > - tertiary `#147efb` > - quaternary `#147efb` > - header\_background `#ffffff` > - header\_primary `#242526` > - highlight `#147efb` > - danger `#f8745c` > - success `#42b72a` > - love `#fa6c8d` > > FKB Pro - Dark > > - primary `#ffffff` > - secondary `#242526` > - tertiary `#147efb` > - quaternary `#4267b2` > - header\_background `#242526` > - header\_primary `#ffffff` > - highlight `#147efb` > - danger `#f8745c` > - success `#42b72a` > - love `#fa6c8d` There are some custom color schemes too which you can change on settings. > **Custom Color Schemes** > > fkb-bg > > - light `#f0f2f5` > - dark `#18191a` > > fkb-header-btn > > - light `#e1e5eb` > - dark `#3a3b3e` > > fkb-header-btn-hover > > - light `#d2d8e1` > - dark `rgba(var(--primary-rgb),.1)` > > fkb-btn > > - light `#e1e5eb` > - dark `#383838` > > fkb-btn-hover > > - light `#d2d8e1` > - dark `rgba(var(--primary-rgb),.1)` * * * More about the latest updates šŸ”½ > [@FKB Pro - Social theme](https://meta.discourse.org/t/fkb-pro-social-theme/234323/56): > > Hello, Iā€™ve create a bigger update on this theme. I will merge this soon. slightly_smiling_face[https://github.com/VaperinaDEV/fkb-pro-theme/pull/13](https://github.com/VaperinaDEV/fkb-pro-theme/pull/13) Changes change layout from flexbox to grid sidebar compatibility new revamped user menu (redesign) clean up the code redesign chat floating navigation controls (notification, create topic button) on mobile desktop version navigation bar on mobile redesign oneboxes and quotes removed avatar and stats (fkb panel) from topic list on mobile removā€¦ and here šŸ”½ > [@FKB Pro - Social theme](https://meta.discourse.org/t/fkb-pro-social-theme/234323/57): > > Hello, Iā€™ve added more updates, fixes etc: improve responsive layout added Discourse Reactions support added sticky new topic banner (floating from top) I testing it a little bit more and after I can merge these changes. slightly_smiling_face Responsive Sticky new topic banner Desktop Mobile There are so many other customizations what I didnā€™t mention. šŸ™‚ * * * > **Credit** ā¤ Huge thanks to @awesomerobot to created [Fakebook](https://meta.discourse.org/t/fakebook-a-theme-for-social-media-lovers/109079) theme and @jordan.vidrine to created Fakebook Modern theme. ---
### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster) #### Post date: [July 28, 2022, 10:23pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/2 "2022-07-28T22:23:23Z")
With iPad it is quiteā€¦ wide. I mean, really wide šŸ˜‰ ![image](https://global.discourse-cdn.com/meta/original/4X/d/a/e/daef2fdf7733a3eb68def539ff9673d913963f48.jpeg) That is because of there is no sidebar, I guess. Any ideas why? ---
### Author: ![darkpixlz](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/darkpixlz/32/549896_2.png) [@darkpixlz](https://meta.discourse.org/u/darkpixlz) #### Post date: [July 28, 2022, 10:33pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/3 "2022-07-28T22:33:50Z")
I love it! My only suggestion is to make the hamburger menu wider and then add padding ![image](https://global.discourse-cdn.com/meta/original/4X/f/7/7/f77df454fbab264ecfa2111ff9a9510366ecf012.png) ---
### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster) #### Post date: [July 28, 2022, 11:04pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/4 "2022-07-28T23:04:05Z")
Another small one: - my forum doesnā€™t use solved-plugin - we donā€™t use badges You know better how I hide those two šŸ˜‰ ![Verkkosieppaus_29-7-2022_15239_foorumi.katiska.eu](https://global.discourse-cdn.com/meta/original/4X/3/7/1/3718b229d5176433a150eb97a8065657b2583a8a.jpeg) Otherwiseā€¦ this theme looks really promising on desktops and mobiles (tablets are little bit problematic) BTW ā€” there is small layout issue with versatile banner. It pushes content below it a little bit too much to left. ---
### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don) #### Post date: [July 28, 2022, 11:18pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/5 "2022-07-28T23:18:09Z")
Hello, I pushed a fix to tablet view. Please update the theme. šŸ™‚ ![Screenshot 2022-07-29 at 1.17.00](https://global.discourse-cdn.com/meta/original/4X/d/6/9/d69f190224187f0eb5c5b8ae99d5d0ddc00a6e91.jpeg) ---
### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster) #### Post date: [July 28, 2022, 11:20pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/6 "2022-07-28T23:20:43Z")
That was fast. Much better, thanks. I got a new default themeā€¦ ---
### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don) #### Post date: [July 28, 2022, 11:23pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/7 "2022-07-28T23:23:51Z")
Thanks šŸ™‚ Yep, I think this is default. The first item is in focus when you open menu. ---
### Author: ![darkpixlz](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/darkpixlz/32/549896_2.png) [@darkpixlz](https://meta.discourse.org/u/darkpixlz) #### Post date: [July 28, 2022, 11:25pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/8 "2022-07-28T23:25:46Z")
Yeah, I was just sugesting that thereā€™s a bit of space inbetween them, besides that the theme looks good for how much I hate facebook and meta haha ---
### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don) #### Post date: [July 28, 2022, 11:44pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/9 "2022-07-28T23:44:14Z")
Thanks šŸ™‚ I pushed a fix for this. Iā€™ve added two theme settings. ![Screenshot 2022-07-29 at 1.42.05](https://global.discourse-cdn.com/meta/original/4X/e/0/a/e0a417c8c7833985da0cbb82c69f12f7bb355b7c.png) > [@Jagster](#): > > there is small layout issue with versatile banner I will check this. ---
### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster) #### Post date: [July 29, 2022, 12:05am UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/10 "2022-07-29T00:05:22Z")
I must be pain in the tender places šŸ¤£ There is one issue. Not for me, but for my top 5 contributers it is matter of life and dead ā€” well, that was perhaps too much but they really want this. Category settings: ![image](https://global.discourse-cdn.com/meta/original/4X/8/d/4/8d4f4794490f779dea3abcc79417d35e5d6c622a.jpeg) It normally shows something like this (on iPad, but you understand what Iā€™m meaning) ![image](https://global.discourse-cdn.com/meta/original/4X/2/f/b/2fb224b14982cc02e2932f30c719a449825995a3.jpeg) Your layout breaks if there is a description or name of category is longer than few characters: ![image](https://global.discourse-cdn.com/meta/original/4X/6/5/1/651930d8cd28cef1161e6a0634b8ec7c947562dc.png) Disabling `show subcategory list aboveā€¦` solves out this, of course. But Iā€™m moving toward using only top-level categories and heavily relying on tags anyway (and then your theme is actually quite suitable in many ways) ā€” so if fixing that would take a little bit too much work and/or you have something more important to do, Iā€™m totally ok if you work with this later. ---
### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don) #### Post date: [July 29, 2022, 11:33am UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/11 "2022-07-29T11:33:11Z")
Hello, Iā€™ve added a [fix for Discourse Reactions](https://meta.discourse.org/t/fkb-pro-social-theme/234323#plugins-fixes-10). šŸ™‚ You can install it as a theme component. ---
### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don) #### Post date: [July 29, 2022, 2:41pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/12 "2022-07-29T14:41:58Z")
Thanks for the report @Jagster. I have pushed a fix for this issue. [FIX: Topic list category layout by VaperinaDEV Ā· Pull Request #3 Ā· VaperinaDEV/fkb-pro-theme Ā· GitHub](https://github.com/VaperinaDEV/fkb-pro-theme/pull/3) ![Screenshot 2022-07-29 at 16.36.10](https://global.discourse-cdn.com/meta/original/4X/d/0/a/d0a60df567bf9b2f21d97bc1dceda8afcd392833.jpeg) ![Screenshot 2022-07-30 at 17.31.10](https://global.discourse-cdn.com/meta/original/4X/6/5/8/658f9d491266d545ee7447670d8b2ddd5f095f7a.png) ---
### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don) #### Post date: [July 30, 2022, 8:04am UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/13 "2022-07-30T08:04:26Z")
> [@Jagster](#): > > BTW ā€” there is small layout issue with versatile banner. It pushes content below it a little bit too much to left. Hello, I have pushed a fix for this. Thanks šŸ™‚ Please update the theme. Before ![Screenshot 2022-07-30 at 10.01.07](https://global.discourse-cdn.com/meta/original/4X/a/d/c/adcf3ae9bcc2362524c5e1e51ec6ff00c8aa8c94.jpeg) After ![Screenshot 2022-07-30 at 10.01.32](https://global.discourse-cdn.com/meta/original/4X/4/3/f/43f26909e1bc2337ee9b74dfc4eec24e785269a4.jpeg) ---
### Author: ![tmn](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tmn/32/267788_2.png) [@tmn](https://meta.discourse.org/u/tmn) #### Post date: [July 30, 2022, 11:04am UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/14 "2022-07-30T11:04:52Z")
very cool theme. pls ad more post for test. ---
### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don) #### Post date: [July 30, 2022, 11:58am UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/15 "2022-07-30T11:58:45Z")
Thanks šŸ™‚ I updated the OP with the theme creator preview link so now you can try it on [https://discourse.theme-creator.io/theme/dodesz/fkb-pro](https://discourse.theme-creator.io/theme/dodesz/fkb-pro) too. ---
### Author: ![png](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/png/32/332783_2.png) [@png](https://meta.discourse.org/u/png) #### Post date: [July 30, 2022, 11:03pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/16 "2022-07-30T23:03:21Z")
Awesome theme! If I can figure out a way to get a freaking domain and an email server ill def use this theme. ---
### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don) #### Post date: [July 31, 2022, 12:53pm UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/18 "2022-07-31T12:53:45Z")
Hello, Iā€™ve added a **new feature** šŸŽ‰ Now you can add custom sidebar content for visitors. [https://github.com/VaperinaDEV/fkb-pro-theme/pull/6](https://github.com/VaperinaDEV/fkb-pro-theme/pull/6) ![Screenshot 2022-07-31 at 14.51.42](https://global.discourse-cdn.com/meta/original/4X/0/5/6/056935a8a10bed0e21f1e1231087947a750d33e7.png) ![Screenshot 2022-07-31 at 14.52.00](https://global.discourse-cdn.com/meta/original/4X/7/9/0/790dd2afab2d0b1a322010a9bbacb1675055d50a.png) ---
### Author: ![tmn](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tmn/32/267788_2.png) [@tmn](https://meta.discourse.org/u/tmn) #### Post date: [August 1, 2022, 9:30am UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/19 "2022-08-01T09:30:11Z")
thank for updated this theme. It would be so great if you develope this theme like blog (forget facebook theme šŸ˜…) suggestion from [https://www.newsbreak.com/](https://www.newsbreak.com/) ![image](https://global.discourse-cdn.com/meta/original/4X/4/c/4/4c4c40304bfab2f3951280c69d2d1dead114f6f4.jpeg) ---
### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster) #### Post date: [August 1, 2022, 11:22am UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/20 "2022-08-01T11:22:43Z")
I disagree šŸ˜‰ Blogish needs are different than trying to offer more SoMe-style for those who thinks Faceboom/insta/etc are the best possible UX/UI-experience. So ā€” out there could be a theme that looks a bit more like blog (what ever that now is meaningā€¦). But this is just fine as it is now. (WordPress is much more superior as blog-platform than Discourse; those are two totally different tools for different purposesā€¦) ---
### Author: ![Paracelsus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/paracelsus/32/164912_2.png) [@Paracelsus](https://meta.discourse.org/u/Paracelsus) #### Post date: [August 1, 2022, 11:44am UTC](https://meta.discourse.org/t/fkb-pro-social-theme/234323/21 "2022-08-01T11:44:01Z")
Hi, great theme! The theme preview in our forum doesnā€™t show with 3 columns, only a one-column layout. I suspect some css problem, but still trying to figure it out. 2 questions: - Is it possible to have fixed width columns upon a minimum screen width (or several, using for instance media css rules) on desktop-mode? The flexible width gives me a bit of headaches in very large monitors (24 or 27ā€™') and the ā€œdead spaceā€ between the three columns is a bit awkward - Is the theme compatible with the component for right side blocks [Right Sidebar Blocks - theme-component - Discourse Meta](https://meta.discourse.org/t/right-sidebar-blocks/231067)? If so, it makes the right column more useful/feature rich. [Next page](https://meta.discourse.org/t/fkb-pro-social-theme/234323.md?page=2)