I'm trying to make a static markdown site with Nuxt.js (and the #nuxtjs/content plugin) and I'd like my authors to be able to keep the images for a particular post in the same directory as the markdown. It'd be a lot easier for them to organize the content that way instead of splitting it between the content and assets directories.
The images that are more widely useful across the site can go in assets of course, but there's lots of images that will only ever be applicable to one post.
I've tried all of the following, and they all create an <img> with the given src, but the image doesn't exist at that url. Instead I get a 1x1 gif.
<img src="bwa_059.png"/>
<img src="./bwa_059.png"/>
Is this possible with Nuxt? I'm kinda surprised I haven't found anyone else even asking about this, since it seems like an author-friendly way of organizing the content.
uhm sorry to ask this but how can you include the images, if they are stored in the assets folder? I am failing terribly at this and don't really know why..
I was also surprised how little comes up on this topic..
Related
I know that the title isn't very clear, but my problem is kind of complicated.
Lets say I am on this website (lets say, example.com), and the website is taking images from another website ( images.com ).
I want to change something so that instead of images.com, example.com takes images from myimages.com.
Still too complicated? I will break it down more. This is what currently is hapenning:
example.com takes images from images.com (I dont know what request it uses)
This is want I want:
example.com takes images from myimages.com
If you still dont understand, please comment below!
If example.com is database driven, simply download the database and do a find for "images.com" and replace with "myimages.com", then reupload the database.
If it is static HTML, repeat by downloading the HTML from example.com, using something like Notepad++ to find in files, then replace all in exactly the same way.
As a sidenote, you should provide as much information as possible as to which platform, codebase and type of request you mean. It will generate higher quality answers.
Most of the time this is done through a GET rest call if done on the server side see https://www.tutorialspoint.com/restful/.
If it is done client side(html css javascript) code you will need to find where that reference is defined in the code and change it. In HTML image tags have an src attribute that tells the page where to grab the image from.
If you go to the example shown here: https://www.w3schools.com/tags/tag_img.asp
and change the image tag src like I do below attribute and click run it will show a the stack overflow image located at https://i.stack.imgur.com/oURrw.png.
<img src="https://i.stack.imgur.com/oURrw.png" alt="Smiley face"
height="42">
I'm looking for something like gulp-html-replace but instead of replacing what's in between the
Will be useful for modifying html documents.
I think you're asking the wrong question. If you have a consistent part (content) present in multiple html documents, you should be using a server side language to generate the html pages. That way you can create partials and modularize them to be included in multiple pages so when you change it once the change can be reflected.
If this is somehow not an option (for whatever reason) you should consider looking at something like handlebars
Also if the content is fairly static, most modern editors will allow you to search / replace in multiple files, there should be no reason to use gulp for what you are describing.
That being said try gulp-inject
Is there any way to protect your sprites on EaselJS?
Currently is too easy to download the sprites.
On chrome just go to console -> resources like this
I made a resarch before i made this answer and found this topic .
That could be very nice. Also we don't need to save the slices in a json like he said, if we have a shuffle seed.
But, i didn't find any thing in nodejs(back-end) to make this image shuffle.
I tried Node GM but its looks too complicaded to bind a image on top of another with (w,h,x,y,offsetX,offsetY)
I know always will have a way to "hack" the resource. But at least offer some difficult.
One of the simple approaches is to encode images to base64, store them as part of Javascript and decode at runtime. See:
Convert and insert Base64 data to Canvas in Javascript
But obviously this will increase download size.
Personally, I would not go this route for "normal" applications or games, unless it is really justified or put on me as an external requirement. For example, one can easily extract assets from the android APK, but this does not seem an area of concern for most of the developers.
The user's browser downloads those images whether you want it or not. Otherwise, they wouldn't be able to display them.
At any given time, any user can just right click on any image on the site and click SAVE AS, you can't stop it, and you shouldn't try.
If you don't want people downloading your work, don't put it on the public facing internet.
I don't know a huge amount about htacess and modrewrite, so I find myself in yet another predicament approaching this new zone for myself.
I will seperate my Inquiries over 2 different questions to allow answers to be on-topic and better targetted to users searching for solutions to their own questions.
This is the second of those 2 inquiries;
I have the following in my htaccess file;
RewriteRule ^install/([a-zA-Z0-9]+)/$ index.php?module=faq&page=howto&program=$1
The concept is that install/abcd/ would call index.php?module=faq&page=howto&program=abcd
That works. It pulls the content, matches it and shows what it is meant to. I have used server variables to show me what is being simulated and it matches up.
However the CSS and images on the page are being stripped as they are relative to the document, not statically assigned.
I am only using htaccess (For Now I guess?) for one solution, with the intention to soon impliment another fairly soon. The intention is to offer our customers easy to read URL's for support purposes, but not rewriting the entire site. SEO isnt a major issue as our site is only to be used by those it is intended for as opposed to a wide audience.
Other than statically assigning css, JS and image files, is there a way to fix this issue so that the page is displayed styled and with the javascript in tact?
Thanks for your help, I hope the question was understandable and as always I appreciate the time you guys take to help us all!
We need to either make the css links absolute (starts with a /) or add a base for all our relative links by adding an extra attribute to the header:
<base href="/">
This would mean that you we start with the subdirectory of /test/. so instead of the css being;
http://domain.com/install/abcd/style.css
It would instead
http://domain.com/style.css
This is the problem I was having due to all my CSS and JS being included relativly (Allowing me to change the directory my script is in).
The above adjustment has in fact fixed my original problem, however without the use of PHP may open up an issue for some who want to be able to deploy the scripts and allow them to be fully dynamic without having to edit the base. Good luck!
At the moment when you go to select an image inside an entry using the EE default file manager, the default view is 'show files as a list'.
Is there a way to show the thumbnail view as the default?
At this point I would be happy with a core hack.
I don't usually use the file manager for sites (much prefer Assets) but this client had a tight budget
I've wondered about doing this in the past as well - turns out it's pretty simple. Open up ee_filebrowser.js and search for the first instance of a("#dir_choice").val(). Immediately after that add this:
; a("#view_type").val('thumb').change();
Make sure you include the leading ;.
I've only tested this in Safari but I can't see why it wouldn't work everywhere. Incidentally, JS beautifier makes this sort of thing infinitely easier.
I don't recommend hacking core for any reason and I suggest it should be avoided at all cost.
With that said, I will provide what I've found out just the same.
Looks like the following files, in EE 2.5.3, are what you'd want to edit:
/themes/javascript/compressed/jquery/plugins/ee_filebrowser.js
/system/expressionengine/libraries/File_field.php
I found these doing a file search in my text editor for view_type which was from the id of that dropdown. The javascript is minified so you'd probably want to un-minify it and then rewrite the part which handles the switch. I'm not the best JS/jQuery person out there, and un-minified js makes it a bit harder too so, I won't offer any more than what I've found so far.
Consider pulling out the parts parts from the two files if you aren't great with js and maybe start a new post tagged accordingly.
Also note: there might be more to this than just those two files so consider this answer a start and nothing more.