Friendica/bookface
1
0
Fork 1
mirror of https://gitlab.com/randompenguin/bookface.git synced 2025-06-07 11:04:27 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update Home

Random Penguin 2025-03-03 06:04:45 +00:00
parent 267df6e074
commit 55c042bd7a
1 changed files with 13 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

14
Home.md

@ -35,7 +35,7 @@ If your Friendica server offers _Bookface_ you simply need to select the "Frio"
1. Tap the three vertical dots in the top-right corner of the screen to open the Main Menu and select "Settings."
![Mobile_Main_Menu.png](uploads/df3d4f0ecb079507f8173790a7226673/Mobile_Main_Menu.png){width=359 height=739}
![Mobile_Main_Menu.png](uploads/df3d4f0ecb079507f8173790a7226673/Mobile_Main_Menu.png){width="359" height="739"}
2. Tap the "\>\>" button in the top-left corner of the screen and select "Display" from the sidebar menu.
![Mobile_Settings_Menu.png](uploads/fcb063754a30680d99ce5285ef86d3d2/Mobile_Settings_Menu.png){width="359" height="739"}
@ -147,10 +147,14 @@ You paste the Bookface stylesheet contents after that.
These instructions are only for those who have to use the Userstyles because their Friendica instance does not offer the Bookface schemes. Do not try to do these steps if you can just select "Bookface" in your Friendica Display Settings.
![Desktop_Scheme_String.png](uploads/8133fb1bb8a09935adc441b7ca0d3299/Desktop_Scheme_String.png)
1. In Friendica go to _Main Menu \> Settings \> Display \> Theme Customizations_
2. If you are using the "Light" version of _Bookface_ either set the "Appearance" drop-down to "Light" or "Custom." If you set it to "Custom" copy and paste this schemestring for the best appearance: `{"nav_bg":"#ffffff","nav_icon_color":"#65686C","link_color":"#0066ff","background_color":"#f2f4f7","background_image":"","contentbg_transp":"100"}`
3. If you are using the "Dark" version of _Bookface_ set the "Appearance" drop-down to either "Dark" or "Black." There is no schemestring for _Bookface_ Dark.
![Desktop_Pick_Dark_Black.png](uploads/7f9ed2c98d230e3f7c8098e376965a2e/Desktop_Pick_Dark_Black.png){width=488 height=286}
## COVER PHOTOS
From version 1.3 Bookface supports adding a "Cover Photo" to your profile pages. There are two places you can add the Cover Photo, depending on whether you want it to appear on all your profile pages or ONLY on yur actual profile page.
@ -167,6 +171,8 @@ Note that this feature only works in recent, modern browsers! Every current and
`[class=coverphoto][img=https://friendica.server/photo/1649cc674810612350.png]Cover photo description alt-text here[/img][/class]`
3. "Submit" your changes.
![cover_photo_profile_description.png](uploads/2fa65f0163ee00cbe318a758255d9b29/cover_photo_profile_description.png){width=507 height=330}
For people who are not using the _Bookface_ scheme they will simply see a thumbnail image of your Cover Photo in the sidebar beneath your profile description. For people who ARE using the _Bookface_ scheme they will see your Cover Photo as a background on your Profile, Conversations, Photos, etc., pages that have a sidebar with your "vcard" info.
### ONLY ON PROFILE PAGE
@ -178,6 +184,8 @@ For people who are not using the _Bookface_ scheme they will simply see a thumbn
3. Check the "Permissions" for the field. If for some reason you only want certain people Circles to see your Cover Photo you can set that here.
4. "Submit" your changes.
![cover_photo_custom_field.png](uploads/ccdc412c22a32e19d89a17212f2b56f2/cover_photo_custom_field.png){width=505 height=360}
People who are not using the _Bookface_ scheme will simply see a thumbnail on your Profile Page in your custom fields. The Cover Photo will _ONLY_ appear on that Profile page (not on your Conversations, Photos, Contacts, etc. pages).
### MULTIPLE COVER PHOTOS
@ -188,6 +196,8 @@ While it is not really recommended you do this, you can place up to FOUR images
`[class=coverphoto][img=https://friendica.server/photo/1649cc674810612350.png]Cover photo 1 description alt-text here[/img][img=https://friendica.server/photo/1649cc677034958382350.png]Cover photo 2 description alt-text here[/img][img=https://friendica.server/photo/1649c038920505603674810612350.png]Cover photo 3 description alt-text here[/img][img=https://friendica.server/photo/3464771649cc674810612350.png]Cover photo 4 description alt-text here[/img][/class]`
![multiple-cover-photos.png](uploads/c06759fa89a16d133657ac169bf48fa2/multiple-cover-photos.png){width=536 height=422}
Extra spaces are okay, but make sure there are no newlines/carriage returns or other elements inside the `[class]...[/class] `or it will mis-count the number of images and size them wrongly. Also keep in mind people not using Bookface will see multiple thumbnails of these images on your Profile. Only Bookface users will see the collage.
# FOR FRIENDICA ADMINS
@ -242,6 +252,8 @@ Starting with Version 1.3 it became much easier to customize the Bookface colors
Most of those should be fairly self-explanatory. If you are redefining the variables in your own block loading after Bookface you only need to include the specific ones you are overriding.
![custom_colors.png](uploads/b54cfc8db76cf3ac5926435019d93712/custom_colors.png)
A good place for server admins to add the CSS variable block is in the "Frio" theme footer template file at _/friendica/view/templates/footer.tpl_ but you should put it inside a _Smarty3_ `{{literal}}<style>...</style>{{/literal}}` block at the end of that file. That way you will only need to re-do it when "Frio" or "Friendica" get updated, not every time there is a _Bookface_ update.
End users can add the block as a user content stylesheet using either userContent.css or the Stylus Add-On in Firefox, with the Stylus Extension in Google Chrome, or the Userscripts Extension in Safari.