Skip to content

Commit 6066a3f

Browse files
Dmitry Pokidovgitbook-bot
Dmitry Pokidov
authored andcommitted
GitBook: [master] 11 pages and 6 assets modified
1 parent 70bd613 commit 6066a3f

16 files changed

+49
-70
lines changed

.gitbook/assets/api_keys.png

45.4 KB
Loading

.gitbook/assets/generate_new_keys.png

19.7 KB
Loading

.gitbook/assets/many_domains.png

13.2 KB
Loading

.gitbook/assets/s3-access.png

-73.1 KB
Binary file not shown.

README.md

+3-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,9 @@ Below is the diagram that shows how Pixboost works:
1010

1111
Here is the short video on how to use Pixboost:
1212

13-
[](https://youtu.be/Uj7EU5rUvx8)
13+
{% embed url="https://youtu.be/Uj7EU5rUvx8" %}
14+
15+
1416

1517
To start working with the service you would only need to register and [add you image source](setup/adding-image-source.md).
1618

api/as-is.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,11 @@ No parameters required.
1414

1515
| Original Image | Image after Pixboost transformation |
1616
| :--- | :--- |
17-
| ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/asis?auth=MTA0ODU5NDA0NQ\_\_) |
17+
| ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/asis?auth=MTA0ODU5NDA0NQ__) |
1818

1919
### Sandbox
2020

2121
| Original Image | Image after Pixboost transformation |
2222
| :--- | :--- |
23-
| [www.midday.coffee/assets/cup.jpeg](www.midday.coffee/assets/cup.jpeg) | [http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/fit?size=200x100&auth=MTA0ODU5NDA0NQ\_\_](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/asis?auth=MTA0ODU5NDA0NQ__)\_ |
23+
| [www.midday.coffee/assets/cup.jpeg](https://github.com/Pixboost/docs/tree/8f93cdfa3e5fdb7584ce488ef51153268bef537f/api/www.midday.coffee/assets/cup.jpeg) | [http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/fit?size=200x100&auth=MTA0ODU5NDA0NQ\_\_](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/asis?auth=MTA0ODU5NDA0NQ__)\_ |
2424

api/fit.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,11 @@ size =`200x100 (scaling by the smaller side which is height, cropping sides, cen
1818

1919
| Parameters | Original | After |
2020
| :--- | :---: | :---: |
21-
| size=200x100 | ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/fit?size=200x100&auth=MTA0ODU5NDA0NQ\_\_) |
21+
| size=200x100 | ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/fit?size=200x100&auth=MTA0ODU5NDA0NQ__) |
2222

2323
### Sandbox
2424

2525
| Original Image | Image after Pixboost transformation |
2626
| :--- | :--- |
27-
| [www.midday.coffee/assets/cup.jpeg](www.midday.coffee/assets/cup.jpeg) | [http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/fit?size=200x100&auth=MTA0ODU5NDA0NQ\_\_](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/fit?size=200x100&auth=MTA0ODU5NDA0NQ__)\_ |
27+
| [www.midday.coffee/assets/cup.jpeg](https://github.com/Pixboost/docs/tree/8f93cdfa3e5fdb7584ce488ef51153268bef537f/api/www.midday.coffee/assets/cup.jpeg) | [http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/fit?size=200x100&auth=MTA0ODU5NDA0NQ\_\_](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/fit?size=200x100&auth=MTA0ODU5NDA0NQ__)\_ |
2828

api/optimise.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -14,13 +14,13 @@ No parameters required.
1414

1515
| Original | After |
1616
| :---: | :---: |
17-
| ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/optimise?&auth=MTA0ODU5NDA0NQ\_\_) |
17+
| ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/optimise?&auth=MTA0ODU5NDA0NQ__) |
1818

19-
In the example above an image becomes at least 20% lighter
19+
In the example above an image becomes at least 20% lighter
2020

2121
### Sandbox
2222

2323
| Original Image | Image after Pixboost transformation |
2424
| :--- | :--- |
25-
| [www.midday.coffee/assets/cup.jpeg](www.midday.coffee/assets/cup.jpeg) | [http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/optimise?&auth=MTA0ODU5NDA0NQ\_\_](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/optimise?&auth=MTA0ODU5NDA0NQ__) |
25+
| [www.midday.coffee/assets/cup.jpeg](https://github.com/Pixboost/docs/tree/8f93cdfa3e5fdb7584ce488ef51153268bef537f/api/www.midday.coffee/assets/cup.jpeg) | [http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/optimise?&auth=MTA0ODU5NDA0NQ\_\_](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/optimise?&auth=MTA0ODU5NDA0NQ__) |
2626

api/resize.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -16,12 +16,12 @@ You can specify only one dimension and the second will be calculated according t
1616

1717
| Parameters | Original | After |
1818
| :--- | :---: | :---: |
19-
| size=200 | ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/resize?size=200&auth=MTA0ODU5NDA0NQ\_\_) |
20-
| size=x80 | ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/resize?size=x80&auth=MTA0ODU5NDA0NQ\_\_) |
19+
| size=200 | ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/resize?size=200&auth=MTA0ODU5NDA0NQ__) |
20+
| size=x80 | ![](http://www.midday.coffee/assets/cup.jpeg) | ![](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/resize?size=x80&auth=MTA0ODU5NDA0NQ__) |
2121

2222
### Sandbox
2323

2424
| Original Image | Image after Pixboost transformation |
2525
| :--- | :--- |
26-
| [www.midday.coffee/assets/cup.jpeg](www.midday.coffee/assets/cup.jpeg) | [http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/resize?size=200x100&auth=MTA0ODU5NDA0NQ\_\_](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/resize?size=200x100&auth=MTA0ODU5NDA0NQ\_\_) |
26+
| [www.midday.coffee/assets/cup.jpeg](https://github.com/Pixboost/docs/tree/a18a5ae66426629920df8220795d1a1ac414a5a0/api/www.midday.coffee/assets/cup.jpeg) | [http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/resize?size=200x100&auth=MTA0ODU5NDA0NQ\_\_](http://pixboost.com/api/2/img/http://www.midday.coffee/assets/cup.jpeg/resize?size=200x100&auth=MTA0ODU5NDA0NQ__) |
2727

quick-start-10-minutes-or-less.md

+4-6
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Quick Start \(under 10 minutes!\)
1+
# Quick Start \(10 minutes or less\)
22

33
We try to make the start with Pixboost as fast and as easy as possible. We aim it to be under 10 minutes. So, lets cut it short.
44

@@ -44,13 +44,11 @@ You can add as many domains and sub-domains as you need by clicking "**Add domai
4444

4545
Below you will see a pre-generated _**API Keys**_, which you will use to access API.
4646

47-
> _**API Key**_ is a value that is generated for security purposes by Pixboost.
48-
> You have to use it in the URLs of images you wish to deliver through Pixboost service.
47+
> _**API Key**_ is a value that is generated for security purposes by Pixboost. You have to use it in the URLs of images you wish to deliver through Pixboost service.
4948
5049
![](.gitbook/assets/api-keys.png)
5150

52-
You might need more than one key in your project. Please read the manual on
53-
[API Keys Usage and Security Issues](./setup/manage-api-keys.md).
51+
You might need more than one key in your project. Please read the manual on [API Keys Usage and Security Issues](setup/manage-api-keys.md).
5452

5553
To add more keys press the "**Generate new key**" link:
5654

@@ -104,5 +102,5 @@ For more information on API, please read the [Images API section](api/).
104102

105103
Update all the **Image URLs** on your website that you wish to process through Pixboost according to the **Step 5** and [Image API](api/) instructions.
106104

107-
Apart from URL-based transformations we provide developers friendly libraries: [pixboost.js](web-dom/) and [pixboost-react](react/).
105+
Apart from URL-based transformations we provide developers friendly libraries: [pixboost.js](web-dom/) and [pixboost-react](react/).
108106

setup/adding-image-source.md

+3-8
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
11
# Adding Images Domain
22

3-
**Image domain** is the domain name of your server where your images are stored.
4-
Pixboost will allow only requests to the images from domains that are listed.
5-
Using list of domains allows us to make service secure and protect you account from malicious
6-
abuse.
3+
**Image domain** is the domain name of your server where your images are stored. Pixboost will allow only requests to the images from domains that are listed. Using list of domains allows us to make service secure and protect you account from malicious abuse.
74

85
When you login for the first time then you will see a "Welcome" banner:
96

@@ -14,8 +11,7 @@ Click on the "Plus" button and you will have to add your domain name in a dialog
1411
![](../.gitbook/assets/add-domain-1.png)
1512

1613
{% hint style="info" %}
17-
If you'd like to load images from a private AWS S3 bucket then click on the "Bucket" icon
18-
and follow [steps from here](./adding-s3-bucket-image-source.md)
14+
If you'd like to load images from a private AWS S3 bucket then click on the "Bucket" icon and follow [steps from here](adding-s3-bucket-image-source.md)
1915
{% endhint %}
2016

2117
Enter your domain and click the "Add" button:
@@ -28,8 +24,7 @@ You will see adeed domain in the list now:
2824

2925
That's enough to start using the service. Try it out it in your browser:
3026

31-
```
27+
```text
3228
https://pixboost.com/api/2/img/http://i.imgur.com/RgSMqlKg.jpg/resize?size=200&auth=MzI0NTc5NDAyMQ__
3329
```
3430

35-
+17-23
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,10 @@
1-
# Adding AWS S3 bucket as image source
1+
# Adding AWS S3 Bucket as Source
22

3-
Using Pixboost, you can set up a private S3 bucket to be a source of your images.
4-
Here, we will go through requirements for the S3 bucket, how to add an integration to Pixboost
5-
and how to optimise images from the bucket using API.
3+
Using Pixboost, you can set up a private S3 bucket to be a source of your images. Here, we will go through requirements for the S3 bucket, how to add an integration to Pixboost and how to optimise images from the bucket using API.
64

75
## AWS setup
86

9-
We assume that you already have S3 bucket with your images stored there. If not then you
10-
can read how to do that [here](https://docs.aws.amazon.com/AmazonS3/latest/user-guide/create-bucket.html).
7+
We assume that you already have S3 bucket with your images stored there. If not then you can read how to do that [here](https://docs.aws.amazon.com/AmazonS3/latest/user-guide/create-bucket.html).
118

129
To setup a new user that you'll integrate with Pixboost:
1310

@@ -17,7 +14,7 @@ To setup a new user that you'll integrate with Pixboost:
1714

1815
Below is an example of a bucket policy:
1916

20-
```json
17+
```javascript
2118
{
2219
"Version": "2012-10-17",
2320
"Statement": [
@@ -39,7 +36,7 @@ Below is an example of a bucket policy:
3936
}
4037
]
4138
}
42-
```
39+
```
4340

4441
## Pixboost setup
4542

@@ -51,13 +48,15 @@ To set up the integration:
5148
![](../.gitbook/assets/add-images-source.png)
5249

5350
* In the appeared form set Type to "Amazon AWS S3 Bucket" and fill in the details
54-
* *Alias* is a unique identifier of the images source that will be used in the URL when calling API
55-
* *Bucket name* is the name of a bucket
56-
* *Region* is an AWS region ID of the bucket
57-
* *Path Prefix* is an optional prefix that will be used for all requests. It could be used if all your images in
51+
* _Alias_ is a unique identifier of the images source that will be used in the URL when calling API
52+
* _Bucket name_ is the name of a bucket
53+
* _Region_ is an AWS region ID of the bucket
54+
* _Path Prefix_ is an optional prefix that will be used for all requests. It could be used if all your images in
55+
5856
the bucket stored in one folder. In that case, you could set "Path prefix", and you won't need to add it to each API call.
59-
* *Access Key* is an AWS IAM user's access key created in the step above
60-
* *Secret Key* is an AWS IAM user's secret key created in the step above
57+
58+
* _Access Key_ is an AWS IAM user's access key created in the step above
59+
* _Secret Key_ is an AWS IAM user's secret key created in the step above
6160

6261
![](../.gitbook/assets/add-s3-images-source.png)
6362

@@ -67,22 +66,17 @@ To set up the integration:
6766

6867
## Using API
6968

70-
All API requests follow the [original pattern](../api/README.md):
69+
All API requests follow the [original pattern](../api/):
7170

7271
`https://pixboost.com/api/2/img/[ALIAS]/[PATH_TO_THE_IMAGE]/[OPERATION]?[OPERATION_PARAMS]&auth=[API_KEY]`
7372

74-
Let's consider a configuration from the step above. For instance, if there is an image in
75-
S3 bucket with a path (key): `prefix/another-prefix/images/hello.png` then to resize it we
76-
use the following API call:
73+
Let's consider a configuration from the step above. For instance, if there is an image in S3 bucket with a path \(key\): `prefix/another-prefix/images/hello.png` then to resize it we use the following API call:
7774

7875
`https://pixboost.com/api/2/img/bucket/images/hello.png/resize?size=200&auth=[API_KEY]`
7976

80-
In the example above `/bucket` (after `/api/2/img`) will be replaced with bucket name and
81-
path prefix - `pixboost-test-source/prefix/another-prefix`
77+
In the example above `/bucket` \(after `/api/2/img`\) will be replaced with bucket name and path prefix - `pixboost-test-source/prefix/another-prefix`
8278

8379
## Limitations
8480

85-
You could have a maximum of 10 images sources. That is a soft limit, so if you'd like
86-
to raise it, please email us at [email protected]
81+
You could have a maximum of 10 images sources. That is a soft limit, so if you'd like to raise it, please email us at [email protected]
8782

88-

setup/cache-invalidation.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,5 +16,5 @@ To use the feature, please:
1616

1717
**Step 3:** Enter the URL of the image you wish to update and press "**Invalidate**" button.
1818

19-
![](../.gitbook/assets/invalidate_cache.png)
19+
![](../.gitbook/assets/invalidate_cache%20%281%29.png)
2020

setup/snippet-generator.md

+8-11
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,20 @@
11
# Snippet Generator
22

3-
**Snippet Generator** is a Tool that helps users to quick start with Pixboost and to make the setup much easier.
4-
It creates the small blocks of reusable code to insert in a code of a website. It is available for all registered users of our service.
3+
**Snippet Generator** is a Tool that helps users to quick start with Pixboost and to make the setup much easier. It creates the small blocks of reusable code to insert in a code of a website. It is available for all registered users of our service.
54

65
![](../.gitbook/assets/main-image.png)
76

8-
To start using Pixboost all you need is to modify the URLs of images that you would like
9-
to pass through the service for optimization for scaling purposes. That's exactly what Snippet Generator will do for you.
7+
To start using Pixboost all you need is to modify the URLs of images that you would like to pass through the service for optimization for scaling purposes. That's exactly what Snippet Generator will do for you.
108

119
## How to use it from a sandbox or from the app
1210

13-
To start using Snippet Generator you have two options.
14-
You either use our demo account to check it out or you log into your Pixboost account
15-
and there you can use this tool for your projects.
11+
To start using Snippet Generator you have two options. You either use our demo account to check it out or you log into your Pixboost account and there you can use this tool for your projects.
1612

17-
For sandbox follow the link to
18-
[start Snippet Generator](https://pixboost.com/snippet/?k=MTg4MjMxMzM3MA__)
13+
For sandbox follow the link to [start Snippet Generator](https://pixboost.com/snippet/?k=MTg4MjMxMzM3MA__)
1914

2015
* Paste URL to the image you would like to compress, scale and deliver through CDN.
21-
Or you can use our example image to see how this tool works. Pre-Set Image URL - `http://www.midday.coffee/image.jpg`
16+
17+
Or you can use our example image to see how this tool works. Pre-Set Image URL - `http://www.midday.coffee/image.jpg`
2218

2319
As a sandbox user or as a registered user you use the Snippet Generator in a similar way:
2420

@@ -41,7 +37,8 @@ As a sandbox user or as a registered user you use the Snippet Generator in a sim
4137
![](../.gitbook/assets/preview-mobile.png)
4238

4339
* Finally, after you are happy with your setup, you can **Copy** snippet and
44-
paste directly into your website code.
40+
41+
paste directly into your website code.
4542

4643
![](../.gitbook/assets/code-snippet-html.png)
4744

shopify.md

+3-10
Original file line numberDiff line numberDiff line change
@@ -32,16 +32,11 @@ Please, follow steps from ["Installation"](shopify.md#installation) section to u
3232

3333
![](.gitbook/assets/shopify-added-theme.png)
3434

35-
At this point, you should be able to preview the theme,
36-
and it will use Pixboost demo account. All the images will be served from
37-
Pixboost Image CDN. Note that first time the images will load slowly as
38-
they will go through optimisation and CDN uploading process.
39-
Reload the page after the initial load to see the real performance.
35+
At this point, you should be able to preview the theme, and it will use Pixboost demo account. All the images will be served from Pixboost Image CDN. Note that first time the images will load slowly as they will go through optimisation and CDN uploading process. Reload the page after the initial load to see the real performance.
4036

4137
![](.gitbook/assets/shopify-preview-theme.png)
4238

43-
Once you are happy with the result, you would need to create a Pixboost account
44-
and use your API key:
39+
Once you are happy with the result, you would need to create a Pixboost account and use your API key:
4540

4641
* [Sign up here](https://github.com/Pixboost/docs/tree/f5010c234fd24fe5e3402831d8152bbad3b3c3ea/shopify/pixboost.com/customer/README.md#/signup) and select Shopify integration
4742

@@ -67,9 +62,7 @@ and use your API key:
6762

6863
![](.gitbook/assets/shopify-save-theme.png)
6964

70-
Congratulation! You now have responsive, optimised and fast images on your
71-
Shopify store. Keep customizing your page layouts and publish the theme once
72-
you are ready.
65+
Congratulation! You now have responsive, optimised and fast images on your Shopify store. Keep customizing your page layouts and publish the theme once you are ready.
7366

7467
## Integration with a custom theme
7568

0 commit comments

Comments
 (0)