Skip to content

Commit

Permalink
Update paperback.mdx
Browse files Browse the repository at this point in the history
Forced image resolutions for screenshots.
  • Loading branch information
DieselTech committed Feb 11, 2024
1 parent dd765aa commit 345c3a7
Showing 1 changed file with 123 additions and 22 deletions.
145 changes: 123 additions & 22 deletions pages/guides/3rdparty/paperback.mdx
Original file line number Diff line number Diff line change
@@ -1,5 +1,20 @@
import { Callout } from 'nextra-theme-docs'
import Image from 'next/image'
import step1 from '../../../public/guides/3rdparty/paperback-image_11.png'
import step2 from '../../../public/guides/3rdparty/paperback-image_10.png'
import step3 from '../../../public/guides/3rdparty/paperback-image_9.png'
import step4 from '../../../public/guides/3rdparty/paperback-image_8.png'
import step5 from '../../../public/guides/3rdparty/paperback-image_6.png'
import step6 from '../../../public/guides/3rdparty/paperback-image_5.png'
import step7 from '../../../public/guides/3rdparty/paperback-image_1.png'
import step8 from '../../../public/guides/3rdparty/paperback-image_4.png'
import step9 from '../../../public/guides/3rdparty/paperback-image_3.png'
import step10 from '../../../public/guides/3rdparty/paperback-image_2.png'
import step11 from '../../../public/guides/3rdparty/paperback-image.png'
import step12 from '../../../public/guides/3rdparty/paperback-img_6210.png'
import step13 from '../../../public/guides/3rdparty/paperback-img_6211.png'
import step14 from '../../../public/guides/3rdparty/paperback-img_6214.png'
import step15 from '../../../public/guides/3rdparty/paperback-img_6215.png'

<Callout emoji="">
Big thanks to aitopu34 a.k.a ACK72 for developing this extension
Expand All @@ -20,55 +35,117 @@ Please do not create issues on Kavita's GitHub for extension-related issues.

## Installation

! **Make sure Kavita is updated to the latest version**
**Make sure Kavita is updated to the latest version**

1. After that, go the to [app store and install Paperback](https://apps.apple.com/us/app/paperback-a-komga-client/id1626613373).

![Image_11](../../../public/guides/3rdparty/paperback-image_11.png?resize=450,450 "Image_11")
<Image
src={step1}
alt="picture"
width={300}
height={300}
/>

2. Go to [https://ack72.github.io/kavya-paperback/](https://ack72.github.io/kavya-paperback/) and tap "**Add to Paperback**"
![Image_10](../../../public/guides/3rdparty/paperback-image_10.png?resize=450,450 "Image_10")

<Image
src={step2}
alt="picture"
width={300}
height={300}
/>

3. Tap "Open" when prompted to Open in "Paperback"?
![Image_9](../../../public/guides/3rdparty/paperback-image_9.png?resize=450,450 "Image_9")

<Image
src={step3}
alt="picture"
width={300}
height={300}
/>

4. Tap "Add as Source Repo"
![Image_8](../../../public/guides/3rdparty/paperback-image_8.png?resize=450,450 "Image_8")

5. Open Paperback and go to **Settings > External Sources > Browse ACK72's Extensions**
![Image_6](../../../public/guides/3rdparty/paperback-image_6.png?resize=450,450 "Image_6")
<Image
src={step4}
alt="picture"
width={300}
height={300}
/>

5. Open Paperback and go to Settings > External Sources > Browse ACK72's Extensions

<Image
src={step5}
alt="picture"
width={300}
height={300}
/>

6. Install Kavya
![Image_5](../../../public/guides/3rdparty/paperback-image_5.png?resize=450,450 "Image_5")

<Image
src={step6}
alt="picture"
width={300}
height={300}
/>

## Setup

To make the extension link with your Kavita instance we need the API Key.
The steps to get the API Key are:

Access your Kavita instance from your web browser and log in
1. Access your Kavita **user** dashboard
2. Switch to "3rd Party Clients" tab
1. Access your Kavita [user dashboard](../user-settings/preferences.mdx)
2. Switch to [3rd Party Clients](../user-settings/3rdpartycilents.mdx) tab
3. Copy the text under the API Key
![Image_1](../../../public/guides/3rdparty/paperback-image_1.png?resize=450,450 "Image_1")

**Once the API KEY is obtained open Paperback**
4. Go back to External Sources page and tap on Kayva
![Image_4](../../../public/guides/3rdparty/paperback-image_4.png?resize=450,450 "Image_4")
<Image
src={step7}
alt="picture"
width={300}
height={300}
/>

4. Open Paperback and back to External Sources page and tap on Kayva

<Image
src={step8}
alt="picture"
width={300}
height={300}
/>

7. Under Source Settings tap on "Server Settings"
![Image_3](../../../public/guides/3rdparty/paperback-image_3.png?resize=450,450 "Image_3")

<Image
src={step9}
alt="picture"
width={300}
height={300}
/>

9. Under Server Settings enter in your your Server URL in the corresponding field.
10. Enter your API key in the corresponding field.
12. Tap Save
![Image_2](../../../public/guides/3rdparty/paperback-image_2.png?resize=450,450 "Image_2")

<Image
src={step10}
alt="picture"
width={300}
height={300}
/>

13. Tap on the Book icon in the bottom left, then "Kavya" in the top of the screen.
14. Swipe down to refresh.
15. Browse your library
![Image](../../../public/guides/3rdparty/paperback-image.png?resize=450,450 "Image")

<Image
src={step11}
alt="picture"
width={300}
height={300}
/>

## Progress Syncing
<Callout type="info">
Expand All @@ -77,14 +154,38 @@ Access your Kavita instance from your web browser and log in

1. Open Paperback and go to Settings
2. Tap External Trackers
![IMG_6210](../../../public/guides/3rdparty/paperback-img_6210.png?resize=450,450 "IMG_6210")

<Image
src={step12}
alt="picture"
width={300}
height={300}
/>

3. Tap Edit and "+"
![IMG_6211](../../../public/guides/3rdparty/paperback-img_6211.png?resize=450,450 "IMG_6211")

<Image
src={step13}
alt="picture"
width={300}
height={300}
/>

4. You can put whatever you would like in the name field. Add this to the URL field: `https://ACK72.github.io/kavya-paperback-tracker` and tap "Add to Paperback"
![IMG_6214](../../../public/guides/3rdparty/paperback-img_6214.png?resize=450,450 "IMG_6214")

<Image
src={step14}
alt="picture"
width={300}
height={300}
/>

5. Tap the source you just named.
6. Tap Install next to the Tracker
![IMG_6215](../../../public/guides/3rdparty/paperback-img_6215.png?resize=450,450 "IMG_6215")

<Image
src={step15}
alt="picture"
width={300}
height={300}
/>

0 comments on commit 345c3a7

Please sign in to comment.